1.获取当前的时间，时间没分每秒都在走，（把握现在，将来会是美好的！）
1 <title>获取当前时间</title> 2 <script type="text/javascript"> 3 onload = function () {//地址对象 函数 4 setInterval(disptime, 1000);//setInterval()可按照指定的周期（以毫秒计）来调用函数或计算表达试 5 } 6 function disptime() { 7 var today = new Date();//获得当前时间 8 var hh = today.getHours();//获得小时，然后判断小时在哪个时间段 9 var sj = null; 10 if (hh <= 12) { 11 sj = "早上好"; 12 } else if (hh > 12 && hh<= 18) { 13 14 sj = "下午好"; 15 } else if (hh> 18) { 16 sj = "晚上好"; 17 } 18 var doc = document.getElementById('myid');//getElementById()方法返回对拥有指点id的第一个对象的引用 一般用于访问DIV 图片 表单元素 网页标签等，但要求访问对象的id是唯一的 19 //设置div的内容为当前时间 20 doc.innerHTML = sj + "<br/>今天日期：" + today.getFullYear() + "年" + (today.getMonth()) + "月" + today.getDate() + "日" + "<br/>现在时间：" + today.getHours() + "时" + today.getMinutes() + "分" + today.getSeconds() + "秒"; 21 } 22 </script> 23 </head> 24 <body > 25 <div id="myid"></div> 26 </body>
实现效果截图：
2.10s倒计时效果，按开始按钮，时间变短，按停止按钮，时间暂停，时间为0时，可以跳转到其他页面
1 <title>10s倒计时效果</title> 2 <script type="text/javascript"> 3 //1.1 取出div中的变量值 4 window.onload = function () { 5 var t1; 6 //1.4 给开始按钮注册事件 7 //锁定开始按钮对象 8 var btnStart = document.getElementById("btnStart"); 9 //结束按钮对象 10 var btnStop = document.getElementById("btnStop"); 11 btnStop.onclick = function () { 12 clearInterval(t1); 13 }; 14 btnStart.onclick = function () { 15 //1.5 16 t1 = setInterval(step, 1000); 17 }; 18 }; 19 20 function step() { 21 //1.2 锁定div对象 22 var dom = document.getElementById("msg"); 23 //1.3 innerText,innerHTML value 24 var num = dom.innerText; 25 //1.6 对num进行--操作 26 if (num > 0) { 27 num--; 28 } 29 //1.7 将运算过的num重新赋值给div的innerText 30 dom.innerText = num; 31 } 32 33 </script> 34 </head> 35 <body> 36 <input type="button" id="btnStart" value="开始" /> 37 <input type="button" id="btnStop" value="停止" /><br /> 38 <div id="msg">10</div> 39 40 </body>
