js实现动态时钟

来源：互联网发布：php加密授权编辑：程序博客网时间：2024/04/30 05:21

网页的动态闹钟其实就是无刷新的动态，一般会用Ajax技术实现，但这次就不用这种了，直接用js实现这个功能。

html主要代码：

<body>当前时间：<div id='myclock'></div> </body>

js代码实现原理其实就是利用了JavaScript中的定时器window.setTimeout(expression,milliseconds);window.setInterval(expression,milliseconds)。

编写一个获取当前时间并转换为规定格式的函数：

function date2str(date, y) {var z = {y: date.getFullYear(),M: date.getMonth() + 1,d: date.getDate(),h: date.getHours(),m: date.getMinutes(),s: date.getSeconds()};return y.replace(/(y+|M+|d+|h+|m+|s+)/g, function(v) {return ((v.length > 1 ? "0" : "") + eval('z.' + v.slice(-1))).slice(-(v.length > 2 ? v.length : 2))});}//测试window.alert(date2str(new Date(), "yyyy-MM-d h:m:s"));</span>

不断运行的定时器

function disptime(){var dateStr=date2str(new Date(), "yyyy-MM-d h:m:s");//window.alert(dateStr);document.getElementById("myclock").innerHTML=dateStr ;//放到函数来是为了不断进行调用window.setTimeout("disptime()",1000);}//第一次调用window.setTimeout("disptime()",1000);

效果图：

0 0