zoukankan      html  css  js  c++  java
  • js定时器

    js定时器主要有两个setTimeout和setInterval。它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。不过这两个函数还是有区别的,setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代码(可以理解为每隔多少时间),而setTimeout只执行一次那段代码(即当多少时间后执行代码)。

    区别:
    window.setTimeout("function",time);//设置一个超时对象,只执行一次,无周期 
    window.setInterval("function",time);//设置一个超时对象,周期='交互时间'
    停止定时: 
    window.clearTimeout(对象) 清除已设置的setTimeout对象
    window.clearInterval(对象) 清除已设置的setInterval对象

    举个例子:

    //只执行一次
    function PerRefresh() {
         var today = new Date();
         alert("The time is: " + today.toString());
         setTimeout("PerRefresh()", 5000);
    }
    
    //每隔5秒执行一次
    setInterval("PerRefresh()", 5000);
    
    function PerRefresh() {
         var today = new Date();
         alert("The time is: " + today.toString());
    }

    1.简单的显示年月日、星期、时间

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>当前系统时间</title>
    <link rel="stylesheet" href="style.css"  />
    <script language="javascript" type="text/javascript">
    
      window.onload = function(){
        showTime();
      }
      function checkTime(i){  //补位处理
        var i;  
        if(i<10){
            i="0"+i;
        }
        return i;
      }
      function showTime(){
        var now=new Date();
        var year=now.getFullYear() ;
        var month=now.getMonth()+1;
        var day=now.getDate();
        var h=now.getHours();
        var m=now.getMinutes();
        var s=now.getSeconds();
        m=checkTime(m);
        s=checkTime(s);
        var d=now.getDay();
        var weekday=new Array(7)
        weekday[0]="星期日"
        weekday[1]="星期一"
        weekday[2]="星期二"
        weekday[3]="星期三"
        weekday[4]="星期四"
        weekday[5]="星期五"
        weekday[6]="星期六"
    
        document.getElementById("show").innerHTML=""+year+""+month+""+day+""+weekday[d]+h+":"+m+":"+s;
        t=setTimeout('showTime()',500);
      }
    
    </script>
    </head>
    <body>
    <div class="content1">
      <div id="show">显示时间的位置</div> 
    </div>
    </body>
    </html>
    View Code

    2.倒计时几天几小时几分几秒

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>倒计时时间</title>
    </head>
    
    <body>
    <div class="content3">
    <div class="time">还剩 <span id="LeftTime"></span></div>
    </div>
    <script>
    function FreshTime()
    {
            var endtime=new Date("2016/12/25,12:12:12");//结束时间
            var nowtime = new Date();//当前时间
            var lefttime= endtime.getTime()-nowtime.getTime() ; 
            d=parseInt(lefttime/(24*60*1000*60));
            h=parseInt((lefttime/(1000*60*60))%60); 
            m=parseInt((lefttime/(1000*60))%60);
            s=parseInt((lefttime/(1000))%60);
                  document.getElementById("LeftTime").innerHTML=d+""+h+"小时"+m+""+s+"";
            if(lefttime<=0){
            document.getElementById("LeftTime").innerHTML="团购已结束";
            clearInterval(sh);
            }
    }
       FreshTime();
       var sh;
       sh=setInterval(FreshTime,500);
    </script>
    </body>
    </html>
  • 相关阅读:
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    财务报表分析(张新民教授)-第七章 企业财务质量分析
    PS
    史上最强视频网站真实地址解析
    jsonp详解
    width:100%缩小窗口时背景图片出现空白bug
  • 原文地址:https://www.cnblogs.com/dxzg/p/6420724.html
Copyright © 2011-2022 走看看