本文实例为大家分享了JS实现倒计时图文效果的具体代码，供大家参考，具体内容如下
<body><img src="images/0.png" alt="" id="h1"><img src="images/0.png" alt="" id="h2"><img src="images/second1.png" alt=""><img src="images/0.png" alt="" id="m1"><img src="images/0.png" alt="" id="m2"><img src="images/second1.png" alt="" ><img src="images/0.png" alt="" id="s1"><img src="images/0.png" alt="" id="s2"> <script type="text/javascript"> //获取节点对象 var oH1=document.getElementById('h1'); var oH2=document.getElementById('h2'); var oM1=document.getElementById('m1'); var oM2=document.getElementById('m2'); var oS1=document.getElementById('s1'); var oS2=document.getElementById('s2'); //函数调用 getTime(); function getTime(){ //获取截止时间到1970年之间的毫秒数 var endTime=new Date('2018-07-13 12:00:00').getTime(); //获取当前时间到1970年之间的毫秒数 var nowTime=new Date().getTime(); //时间差（毫秒） var leftTime=endTime-nowTime; //获取时分秒 var h=parseInt(leftTime/1000/3600);//获得剩余的小时数 var m=parseInt(leftTime/1000/60%60);//获得剩余的分钟 var s=parseInt(leftTime/1000%60);//获得剩余的秒数 //加零(无论是小时还是分钟还是秒数都会有单个数的时候，所以可以通过加零来让其变成两位数) h=setNum(h); m=setNum(m); s=setNum(s); //双位数变成单位数 var h1=h%10; var h2=parseInt(h/10); var m1=m%10; var m2=parseInt(m/10); var s1=s%10; var s2=parseInt(s/10); //改变图片地址(下面两种方法都可以实现图片地址的变化) oH1.setAttribute('src','images/'+h2+'.png'); oH2.setAttribute('src','images/'+h1+'.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'); setTimeout(getTime,1000); } //添零函数 function setNum(num){ if(num<10){ num="0"+num; } return num; } </script></body>
见下图：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
