JS计算网页停留时间代码可以帮助网页作者分析读者在该网页上的停留时间,进而提高网站的口碑和用户粘度。以下是JS计算网页停留时间代码的完整攻略。
1. 标准浏览器方法
要实现JS计算网页停留时间的代码,可以使用标准的浏览器方法。具体实现方法如下:
- 在网页中添加以下代码:
<script>
var timeStart=0, timeEnd=0, time=0;
function pageLoadTime() {
timeEnd = new Date().getTime();
timeSpent = (timeEnd - timeStart) / 1000;
// 把时间展示在控制台上
console.log('你停留在此页面的时间是:' + timeSpent + '秒');
}
window.onload=function(){timeStart = new Date().getTime();}
window.onbeforeunload = pageLoadTime;
</script>
- 这样,当用户离开网站时,上述代码就会在控制台上输出读者在该网页上停留的时间。注意,该方法的计时方式是用户打开网页后,定时器开始计时,如果用户离开网页就停止计时。
2. 非标准浏览器方法
接下来介绍一种主要用于移动端和低版本浏览器的后退和前进按钮计算方法,代码如下:
<script>
var timeStart;
function timeCount() {
var timeEnd = new Date().getTime();
var timeSpent = (timeEnd - timeStart) / 1000;
// 把时间展示在控制台上
console.log('你停留在此页面的时间是:' + timeSpent + '秒');
}
window.addEventListener('popstate', timeCount);
window.addEventListener('load', function(){
timeStart = new Date().getTime();
history.pushState(false, null, null);
});
</script>
这种方式主要是在浏览器的前进和后退按钮被点击时重新进行计时。首先在window的onload
事件中给timeStart
赋值,然后在history的pushState
方法中添加一个音调参数并被忽略。得以进行前进后退时的重新计时。
3. 示例说明
下面使用两个示例来说明和测试上述的代码。
- 标准浏览器方法
使用Chrome浏览器,按下F12或ctrl+shift+i进入控制台,在面板的console中检查代码的输出情况。
- 非标准浏览器方法
在火狐浏览器中检查代码输出情况,按下ALT+方向键进行前进后退,检查输出结果。
总之,上面是JS计算网页停留时间代码的两个示例和完整攻略。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JS计算网页停留时间代码 - Python技术站