JavaScript history is often used for product recent history browsing page 1/2_jquery

This article will use js cookie to implement this function. Because I have been studying jquery recently, I will use it by the way. If you don’t want to use jquery, then you need to understand the implementation process. Okay, you can write the code yourself.
You need to use a jquery cookie plug-in to operate cookies
You need to know a little bit about json. The data uses json. For simplicity, it is assumed here that only 3 browsing records are recorded.
The basic process is as follows:
1. If the number of historical products recorded in the cookie is 0 or 1 or 2, insert it directly into the cookie.
2. If the number of records in the cookie is 3 (because we have limited it to only 3 records), then remove the first set of records. The way to remove them is to traverse again, but not from the first one. Starting from the second one, insert new history records.

Preparation:
1. The json string we want to store in the cookie is similar to the following:

Copy code The code is as follows :

var hisProduct = eval[
{"url":"1.html","imgurl":"1.jpg","proname":"pig1","proprice" :100},
{"url":"2.html","imgurl":"2.jpg","proname":"pig2","proprice":200},
{"url" :"3.html","imgurl":"3.jpg","proname":"pig3","proprice":300}
];

url: Is the product page url
imgurl: Is the picture url
proname: Product name
proprice: Product price
2. How to obtain this information? Let’s take Jingdong Mall as an example:

What we need to get is the “yellow area” part above, and the other is the page address. Looking at its code, the code block that locates the key part is as follows:

HP Deskjet D2568 Color Inkjet Photo Printer

Best price dual ink drop printing technology restores the true color of photos

img10.360buy.com/S1/809/8b2bf92f-74f9 -46c2-929d-f47fa6fce2d1.jpg" width="349" jqimg="http://img10.360buy.com/S0/809/8b2bf92f-74f9-46c2-929d-f47fa6fce2d1.jpg"/>< ;/p

JD.com’s prices are made into pictures:

• Product number: 131407
• Market price:￥499.00
price.360buy.com/P7EDAD82DC8D8212393096333144388F6,3.png" />(Notify me of price reduction)


Use jquery to get the information we need:





Copy code Code As follows:


$(function(){
var pro_url = document.URL;//Page address
var pro_name = $(".Product_Name h1").text(); //Product name
var pro_img = $("#Product_BigImage img")[0].src; //Image path
var pro_price = $(".Pro_baseinfo li").eq(2).children( "img")[0].src;//Price
})



Supplement: Jingdong’s is a bit more complicated here, and if we write the program ourselves, we can give it a An id of the element to be retrieved.

Demo acquisition (please refresh once after "Run Code")