javascript统计网站运行时间动态输出每秒变化

原创 彭淇  2017-08-09 07:54:01  阅读 1865 次 评论 2 条
华为云秒杀活动

大家都知道javascript产生时钟的方法,而这里飞翔勿扰要跟大家分享的网站运行时间动态输出就是从时钟产生演变而来。

话不多说,先把干货代码送上:


<script>
function secondToDate(second) {
    if (!second) {
        return 0
    }
    var time = new Array(0, 0, 0, 0, 0); /*if(second>=365*24*3600){time[0]=parseInt(second/(365*24*3600));second%=365*24*3600}*/
    if (second >= 24 * 3600) {
        time[1] = parseInt(second / (24 * 3600));
        second %= 24 * 3600
    }
    if (second >= 3600) {
        time[2] = parseInt(second / 3600);
        second %= 3600
    }
    if (second >= 60) {
        time[3] = parseInt(second / 60);
        second %= 60
    }
    if (second > 0) {
        time[4] = second
    }
    return time
} 
< /script>  
< script type = "text/javascript" language = "javascript" >
    function setTime() {
        var create_time = Math.round(new Date(Date.UTC(2015, 10, 25, 0, 0, 0)).getTime() / 1000);
        var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000);
        currentTime = secondToDate((timestamp - create_time));
        currentTimeHtml = currentTime[1] + '天' + currentTime[2] + '小时' + currentTime[3] + '分' + currentTime[4] + '秒';
        document.getElementById("htmer_time").innerHTML = currentTimeHtml
    }
setInterval(setTime, 1000); 
< /script>
 < li > < i class = "iconfont" > & #xe633; < /i > 
 稳定运行: < span id = "htmer_time" class = "sm_padding" > < /span > < /li >


你可以把这段代码放置到需要输出运行时间的地方,例如本站是放到 footer.php的位置。

下面简单介绍一下这段代码

注意这个位置:


var create_time=Math.round(new Date(Date.UTC(2015,10,25,0,0,0)).getTime()/1000);


(2015,10,25,0,0,0)代表建站日期,这个时间代表2015年11月25日 00:00::00

你应该发现了月份的特殊性,从0-11代表1-12月,即比实际月份小1。

这一句:


document.getElementById("htmer_time").innerHTML=currentTimeHtml}setInterval(setTime,1000);


代表把id=htmer_time的内容变成运行时间并每秒变化,所以我们在下面需要有一个对应id的位置放置时间:

<span id="htmer_time" class="sm_padding"></span>


大概就是这样啦~

本文地址:http://pengqi.club/blog/6.html
版权声明:本文为原创文章,版权归 彭淇 所有,欢迎分享本文,转载请保留出处!
华为云秒杀活动
华为云秒杀活动

发表评论


表情

评论列表

  1. 雷州
    雷州 【县长】  @回复

    [code][S8]有点看不懂哦,希望下次写的简单易懂一点![/code]

  2. 匿名
    匿名 【县长】  @回复

    [blockquote][F1] 好羞射,文章真的好赞啊,顶博主![/blockquote]