本文給大家分享利用cookie插件獲取用戶瀏覽文章或者是網頁的歷史記錄，并把用戶最近瀏覽過的信息顯示在頁面，涉及到 jquery.cookie.js相關知識，感興趣的朋友可以參考下

本文就是要利用cookie插件，獲取用戶瀏覽文章歷史記錄，并將用戶最近瀏覽歷史記錄顯示在頁面。

在需要添加cookie的頁面加上如下js

1. <script type="text/javascript" src="js/jquery.js"></script> 
2. <script type="text/javascript" src="js/jquery.cookie.js"></script> 
3. <script type="text/javascript"> 
4. $(function(){ 
5. var art_title = $("title").html(); 
6. var art_url = document.URL; 
7. var history; 
8. var json="["; 
9. //json1是第一次注入cookie以后的第一個json，"此時還不是數組" 以點帶面的處理 
10. var json1; 
11. var canAdd= true; 
12. //var json1=eval("({sitename:'dreamdu',sitedate:new Date(1980, 12, 17, 12, 0, 0)})"); 
13. if(!$.cookie("history")){ 
14. //第一次的時候需要初始化 
15. history = $.cookie("history","{title:/""+art_title+"/""+",url:/""+art_url+"/"}"); 
16. }else { 
17. //已經存在 
18. history = $.cookie("history"); 
19. json1 = eval("("+history+")"); 
20. $(json1).each(function(){ 
21. if(this.title==art_title){ 
22. canAdd=false; 
23. return false; 
24. } 
25. }) 
26. if(canAdd){ 
27. $(json1).each(function(){ 
28. json = json + "{/"title/":/""+this.title+"/",/"url/":/""+this.url+"/"},"; 
29. }) 
30. json = json + "{/"title/":/""+art_title+"/",/"url/":/""+art_url+"/"}]";  
31. $.cookie("history",json,{expires:1}); 
32. } 
33. } 
34. }) 
35. </script> 

在展示歷史記錄的頁面添加如下js

1. <script type="text/javascript" src="js/jquery.js"></script> 
2. <script type="text/javascript" src="js/jquery.cookie.js"></script> 
3. <script type="text/javascript"> 
4. $(function(){  
5. if($.cookie("history")){ 
6. var json = eval("("+$.cookie("history")+")");  
7. var list ="";  
8. $(json).each(function(){ 
9. list = list + "<li><a href='"+this.url+"' target='_blank'>"+this.title+"</a></li>"; 
10. alert(this.url); 
11. }) 
12. $("#list").html(list);; 
13. }  
14. });  
15. </script> 
16. </head> 

以上內容是小編給大家分享的通過Jquery.cookie.js實現展示瀏覽網頁的歷史記錄，希望大家喜歡。