when copied/pasted code into the console after loading the page, it will allow to display in the console the name and the price of items shown. If the user scrolls the page, the code should automatically push information of the new products shown to the console.

Extract_Element_On_Screen_By_JS_With_scrolling.js

/*
   * Sample website: https://www.leslipfrancais.fr/maillots-de-bain-326#
   * If an element is visible, which mean its' top and left both greater than 0 
   * and its' right  and bottom should less than the screen
   * This is how we know whether an element is on the screen
*/

function isVisible(elem) {
    var location = elem.getBoundingClientRect();
    return (
        location.top >= 0 &&
        location.left >= 0 &&
        location.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
        location.right <= (window.innerWidth || document.documentElement.clientHeight)
    );
};

/*

    * Add EventListener to scroll event
    * Only console the element which is on screen
    * By the way, I find out that if we trying to use "windows.addEventListener(scroll)"
    * It won't work, for reason that the website has used the Scroll-linked effects
    * "windows.addEventListener(scroll)" has listened to other function
	* By the way, We don't want to console too many times when scrolling
	* So we add a new array to save the products which have consoled
	* Copy and paste the code into Console. You will see that the products information will be displayed  in the console when scrolling
	* If we only need product_name or product_price, we can use String.Split("\n") to get more specific the information
	* If it doesn't work, try to refresh the page and paste the code again. Or try to test in a higher version of the browser(Chrome or Firefox)
	* more detail in : https://gist.github.com/LRENZ/c3c532dfc1a01860eeca8d4bd00a9a9c
	* Add new Version to console the product info without the scolling trigger
    
*/
var temp = []
function extract_element(){
	var product = document.getElementsByClassName("product-container");
    if (product) {
        for (var prod of product) {
            if (isVisible(prod)) {
                if (!temp.includes(prod.innerText)) {
                    console.log(prod.innerText);
                    temp.push(prod.innerText);
                }
            }
        }
    }
}

extract_element()
document.addEventListener('scroll', function(event) {
	extract_element()
});

When you copied and pasted the code into Console, try to Srcoll, You will See the following:



If it doesn't work, try to refresh the page and paste the code again. Or try to test in a higher version of the browser(Chrome or Firefox)