利用js實(shí)現(xiàn)在瀏覽器狀態(tài)欄顯示訪問(wèn)者在本頁(yè)停留的時(shí)間

2019-11-20 21:21:12

字體：大中小

供稿：網(wǎng)友

問(wèn)題描述：在狀態(tài)欄上顯示，訪問(wèn)者在本頁(yè)停留的時(shí)間（如：您在本頁(yè)停留了（如：您在本頁(yè)停留了 X小時(shí) X分 X秒）

該問(wèn)題相當(dāng)于是設(shè)計(jì)一個(gè)計(jì)時(shí)器，用于顯示瀏覽者在該頁(yè)面停留了多長(zhǎng)時(shí)間。要解決該問(wèn)題，我想到的主要有兩種方法。

方法一：利用系統(tǒng)時(shí)間。即先設(shè)置一個(gè)變量，用于獲取登錄開(kāi)始時(shí)間startTime,然后利用setTimeout()函數(shù)讓頁(yè)面不停的刷新，在刷新的同時(shí)，獲取當(dāng)前時(shí)間nowTime，然后用當(dāng)前時(shí)間減去登錄開(kāi)始時(shí)間，即為停留時(shí)間。在此就不做詳細(xì)編寫(xiě)。重點(diǎn)說(shuō)下下面使用到的方法二來(lái)進(jìn)行實(shí)現(xiàn)。

方法二：設(shè)置三個(gè)變量：second,minute,hour。然后讓second不停的+1，并且利用setTimeout實(shí)現(xiàn)頁(yè)面每隔一秒刷新一次，當(dāng)second大于等于60時(shí)，minute開(kāi)始+1，并且讓second重新置零。同理當(dāng)minute大于等于60時(shí)，hour開(kāi)始+1。這樣即可實(shí)現(xiàn)計(jì)時(shí)功能。

方法二代碼如下：

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

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>無(wú)標(biāo)題文檔</title> 
</head> 
<body onload="timeCount()"> 
<script type="text/javascript"> 
var second=0; 
var minute=0; 
var hour=0; 
function timeCount(){ 
second=second+1; 
setTimeout("timeCount()",1000); 
while(second>=60){ 
minute=minute+1; 
second=0; 
while(minute>=60){ 
hour=hour+1; 
minute=0; 
second=0; 
} 
} 
window.status="你在本網(wǎng)頁(yè)停留了"+hour+"小時(shí)"+minute+"分"+second+"秒"; 
} 
</script> 
</body> 
</html> 