JS實(shí)現(xiàn)倒計(jì)時(shí)圖文效果

本文實(shí)例為大家分享了JS實(shí)現(xiàn)倒計(jì)時(shí)圖文效果的具體代碼，供大家參考，具體內(nèi)容如下

成都創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的宣威網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

<body>
<img src="images/0.png"  id="h2">
<img src="images/0.png"  id="h3">
<img src="images/second1.png" >
<img src="images/0.png"  id="m1">
<img src="images/0.png"  id="m2">
<img src="images/second1.png"  >
<img src="images/0.png"  id="s1">
<img src="images/0.png"  id="s2">
  <script type="text/javascript">
  //獲取節(jié)點(diǎn)對(duì)象
  var oH1=document.getElementById('h2');
  var oH2=document.getElementById('h3');
  var oM1=document.getElementById('m1');
  var oM2=document.getElementById('m2');
  var oS1=document.getElementById('s1');
  var oS2=document.getElementById('s2');
  //函數(shù)調(diào)用
  getTime();
  function getTime(){
  //獲取截止時(shí)間到1970年之間的毫秒數(shù)
    var endTime=new Date('2018-07-13 12:00:00').getTime();
  //獲取當(dāng)前時(shí)間到1970年之間的毫秒數(shù)
    var  nowTime=new Date().getTime();
  //時(shí)間差（毫秒）
    var leftTime=endTime-nowTime;
  //獲取時(shí)分秒
    var h=parseInt(leftTime/1000/3600);//獲得剩余的小時(shí)數(shù)
    var m=parseInt(leftTime/1000/60%60);//獲得剩余的分鐘
    var s=parseInt(leftTime/1000%60);//獲得剩余的秒數(shù)
  //加零(無論是小時(shí)還是分鐘還是秒數(shù)都會(huì)有單個(gè)數(shù)的時(shí)候，所以可以通過加零來讓其變成兩位數(shù))
    h=setNum(h);
    m=setNum(m);
    s=setNum(s);
  //雙位數(shù)變成單位數(shù)
    var h2=h%10;
    var h3=parseInt(h/10);
    var m1=m%10;
    var m2=parseInt(m/10);
    var s1=s%10;
    var s2=parseInt(s/10);
  //改變圖片地址(下面兩種方法都可以實(shí)現(xiàn)圖片地址的變化)
    oH1.setAttribute('src','images/'+h3+'.png');
    oH2.setAttribute('src','images/'+h2+'.png');
    oM1.setAttribute('src','images/'+m2+'.png');
    oM2.setAttribute('src','images/'+m1+'.png');
    oS1.setAttribute('src','images/'+s2+'.png');
    oS2.setAttribute('src','images/'+s1+'.png');
    /*oH1.src='images/'+h3+'.png';
    oH2.src='images/'+h2+'.png';
    oM1.src='images/'+m2+'.png';
    oM2.src='images/'+m1+'.png';
    oS1.src='images/'+s2+'.png';
    oS2.src='images/'+s1+'.png';*/
    setTimeout(getTime,1000);
 }
 //添零函數(shù)
 function  setNum(num){
    if(num<10){
      num="0"+num;
    }
    return num;
  }
  </script>
</body>

見下圖：

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。

新聞標(biāo)題：JS實(shí)現(xiàn)倒計(jì)時(shí)圖文效果
當(dāng)前鏈接：http://jinyejixie.com/article6/pgihog.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、商城網(wǎng)站、網(wǎng)站內(nèi)鏈、手機(jī)網(wǎng)站建設(shè)、定制開發(fā)、建站公司

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

成人午夜视频全免费观看高清-秋霞福利视频一区二区三区-国产精品久久久久电影小说-亚洲不卡区三一区三区一区

JS實(shí)現(xiàn)倒計(jì)時(shí)圖文效果