快捷導(dǎo)航

javascript結(jié)合Cookies實(shí)現(xiàn)瀏覽記錄歷史第1/3頁

更新時(shí)間：2008年09月02日 15:38:23 作者：

最近在工作當(dāng)中遇到一個(gè)問題有個(gè)頁面需要添加一個(gè)瀏覽歷史記錄功能，具體來說就是要記錄下用戶在此網(wǎng)站的點(diǎn)擊歷史并把它們降序排列出來（只顯示前6個(gè)瀏覽歷史而且不能重復(fù)）。

由于以前對(duì)javascript了解不夠深入，一時(shí)間手足無措。
后來經(jīng)過兩位高手同事的指點(diǎn)（對(duì)這兩位同事的敬仰猶如滔滔江水連綿不絕...），恍然大悟，豁然開朗
成功地完成了此功能的添加。

首先來介紹一下javascript中關(guān)于此功能的一些對(duì)象和方法:

1. window.event對(duì)象：
event代表事件的狀態(tài)，例如觸發(fā)event對(duì)象的元素、鼠標(biāo)的位置及狀態(tài)、按下的鍵等等。
event對(duì)象只在事件發(fā)生的過程中才有效。

2. event.srcElement：
表示該事件的發(fā)生源通俗一點(diǎn)說也就是該事件被觸發(fā)的地方

3. srcElement.parentNode：
表示該事件發(fā)生源的父結(jié)點(diǎn)

4. srcElement.tagName：
表示事件發(fā)生源的標(biāo)簽名

5. toUpperCase()：
大寫化相應(yīng)字符串的方法

基本上就是這些屬性和方法，可能對(duì)于剛剛接觸javascript的朋友們或者以前很少使用此類功能的朋友來說，這些對(duì)象有些陌生，不過沒關(guān)系，了解以后發(fā)現(xiàn)其實(shí)并不難，和javascript驗(yàn)證表單之類的并沒有太多的不同。

下面就結(jié)合程序給大家一步一步講解（程序難免有不合理之處，希望大家多多指正，共同進(jìn)步）：

第一部分：javascript紀(jì)錄瀏覽動(dòng)作。

復(fù)制代碼代碼如下:

function glog(evt) //定義紀(jì)錄鼠標(biāo)點(diǎn)擊動(dòng)作的函數(shù) 

{ 

evt=evt?evt:window.event;var srcElem=(evt.target)?evt.target:evt.srcElement; 

try 

{ 

while(srcElem.parentNode&&srcElem!=srcElem.parentNode) 

//以上這個(gè)語句判斷鼠標(biāo)動(dòng)作是否發(fā)生在有效區(qū)域，防止用戶的無效點(diǎn)擊也被紀(jì)錄下來 

{ 

if(srcElem.tagName&&srcElem.tagName.toUpperCase()=="A")//判斷用戶點(diǎn)擊的對(duì)象是否屬于鏈接 

{ 

linkname=srcElem.innerHTML; //取出事件發(fā)生源的名稱，也就是<a>和<a/>之間的文字，也就是鏈接名稱哈 

address=srcElem.href+"_www.achome.cn_"; //取出事件發(fā)生源的href值，也就是該鏈接的地址 

wlink=linkname+"+"+address; //將鏈接名稱和鏈接地址整合到一個(gè)變量當(dāng)中 

old_info=getCookie("history_info"); //從Cookies中取出以前紀(jì)錄的瀏覽歷史，該函數(shù)后面有聲明 

//以下程序開始判斷新的瀏覽動(dòng)作是否和已有的前6個(gè)歷史重復(fù)，如果不重復(fù)則寫入cookies 

var insert=true; 

if(old_info==null) //判斷cookie是否為空 

{ 

insert=true; 

} 

else 

{ 

var old_link=old_info.split("_www.achome.cn_"); 

for(var j=0;j<=5;j++) 

{ 

if(old_link[j].indexOf(linkname)!=-1) 

insert=false; 

if(old_link[j]=="null") 

break; 

} 

} 

if(insert) 

{ 

wlink+=getCookie("history_info"); 

setCookie("history_info",wlink); //寫入cookie，該函數(shù)后面有聲明 

history_show().reload(); 

break; 

} 

} 

srcElem = srcElem.parentNode; 

} 

} 

catch(e){} 

return true; 

} 

document.onclick=glog;//使每一次頁面的點(diǎn)擊動(dòng)作都執(zhí)行g(shù)log函數(shù)