一个简单的网页计时器

一个简单的网页计时器

作用

记录浏览该网页用的时间

实现

js源码

var hiddenProperty = 'hidden' in document ? 'hidden' :    
    'webkitHidden' in document ? 'webkitHidden' :    
    'mozHidden' in document ? 'mozHidden' :    
    null;

var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');

var timer = function(){
    time=time+1;
    document.getElementById("time").innerHTML=time;
    localStorage.time=time;
}

var onVisibilityChange = function(){
    if (!document[hiddenProperty]) {    
        if(timing===null){
            timing = setInterval(timer,1000);
        }
        
    }else{
        if(timing!==null){
            clearInterval(timing);
            timing=null;
        }   
    }
}

var time=0;

if(localStorage.time!==undefined){
    time=parseInt(localStorage.time);
}

var timing=setInterval(timer,1000);

document.addEventListener(visibilityChangeEvent, onVisibilityChange);

主要技术

1. 判断用户正在浏览该网页
2. 计时器
3. 将时间保存至本地

效果图

github地址