js实现时钟定时器
本文实例为大家分享了js实现时钟定时器的具体代码，供大家参考，具体内容如下
<!DOCTYPE html><html> <head> <meta charset='UTF-8'> <title>时钟</title> <script type='text/javascript'> function showClock(){ // 1. 获取当前时间 var time = new Date(); // document.write(time); var year = time.getFullYear(); // document.write(year); var month = time.getMonth() + 1; // document.write(month); var day = time.getDate(); // var day1 = time.getDay(); // document.write(day1); var hours = time.getHours(); // document.write(hours); var minutes = time.getMinutes(); // document.write(minutes); var seconds = time.getSeconds(); document.getElementById('clock').innerHTML = year+'-'+month+'-'+day+' ' +hours+':'+minutes+':'+seconds; } var flag = true; var id; function runClock(){ var btn = document.getElementById('btn'); if(flag){ // 计时操作 id = setInterval('showClock()',1000); flag = false; btn.innerHTML = '停止'; }else{ // 停止计时操作 clearInterval(id); flag = true; btn.innerHTML = '动起来'; } } </script> </head> <body> <button οnclick='showClock()'>点击显示时钟</button> <div id='clock'> </div> <button οnclick='runClock()'>动起来</button> </body></html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持好吧啦网。
相关文章：
1. IDEA的Mybatis Generator驼峰配置问题2. javascript设计模式 ? 建造者模式原理与应用实例分析3. 一篇文章带你了解JavaScript-对象4. Express 框架中使用 EJS 模板引擎并结合 silly-datetime 库进行日期格式化的实现方法5. Java构建JDBC应用程序的实例操作6. Python使用oslo.vmware管理ESXI虚拟机的示例参考7. IntelliJ Idea2017如何修改缓存文件的路径8. IntelliJ IDEA设置条件断点的方法步骤9. Jsp中request的3个基础实践10. 浅谈SpringMVC jsp前台获取参数的方式 EL表达式
网公网安备