zoukankan      html  css  js  c++  java
  • Javascript倒计时

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
      <meta name="generator" content="editplus" />
      <meta name="author" content="" />
      <meta name="keywords" content="" />
      <meta name="description" content="" />
      <meta http-equiv="content-type" content="text/htm;charset=utf-8" />
     </head>
    
     <body>
      <div>
    	距离广州亚运会开幕时间2010年11月12还有:<span id="otherTime"></span>
      </div>
    <script type="text/javascript">
    	var objElem = document.getElementById("otherTime");
    
    	var endTime = new Date('2010', '10', '12').getTime();
    
    	var nowTime = null;
    	var laveTimer = null;
    
    	function laveTime() {
    		nowTime = new Date().getTime();
    
    		var a = endTime - nowTime;//距离指定的时间还有多少毫秒..
    
    		if (a > 0) {
    			
    			var arr_1 = [1000*60*60*24, 1000*60*60, 1000*60, 1000],
    				arr_2 = ['天', '小时', '分', '秒'],
    				temp = null;
    			
    			var timeDesArr = [];
    
    			for (var i = 0, len = arr_1.length; i<len ; i++) {
    				temp = Math.floor(a/arr_1[i]);
    
    				if (temp > 0) {
    					timeDesArr.push((String(temp).length == 1 ? ("00"+temp).substr(1) : temp) + arr_2[i]);
    				}
    				
    				a -= arr_1[i]*temp;
    			}
    
    			objElem.innerHTML = timeDesArr.join("");
    
    		} else {
    			objElem.innerHTML = "到时间了!";
    			clearInterval(laveTime);
    			laveTime = null;
    		}
    	}
    	
    	//因为我们的时候是一秒一秒的在走,那么也需要一秒一秒的改变一下这个剩余时间了,一秒执行一次laveTime函数
    	laveTimer = setInterval(laveTime, 1*1000);
    </script>
    
     </body>
    </html>
    
     
     
    运行示例代码:
  • 相关阅读:
    使用 Rust 编写更快的 React 组件
    快速入门 postcss 插件:自动转换 px 到 rem
    通过实战理解CPU上下文切换
    “web资源加载优先级”原来能这么精准控制
    使用Brotli提高网站访问速度
    使用 npm shrinkwrap 来管理项目依赖
    如何用“底层逻辑”,看清世界的底牌?
    Node.js 应用全链路追踪技术——全链路信息获取
    解决 Elastic Search 的深分页问题
    Whistle 实现原理 —— 从 0 开始实现一个抓包工具
  • 原文地址:https://www.cnblogs.com/meteoric_cry/p/1824732.html
Copyright © 2011-2022 走看看