JavaScript实时更新当前的时间的示例代码


Posted in Javascript onJuly 15, 2020

实现的效果如下:

JavaScript实时更新当前的时间的示例代码

时间会实时更新

具体的JS代码如下

var dateStart;
function start() {
 dateStart = new Date(); //开始时间
 startTime();
}
function startTime() {
 set = window.setTimeout("startTime()", 1000);
 var dt = new Date();
 var day = dt.getDay();
 var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
 var week = weeks[day];
 var year = dt.getFullYear();//年
 var month = dt.getMonth() + 1;//月
 var date = dt.getDate();//日
 var h = dt.getHours();
 if (h < 10) h = '0' + h;//时
 var i = dt.getMinutes();
 if (i < 10) i = '0' + i;//分
 var s = dt.getSeconds();
 if (s < 10) s = '0' + s;//秒
 var str = year + "年"+ month + "月" + date + "日" + h + ':' + i + ':' + s;
 console.log('时间:'+str,'星期:'+week)
 $('#ymd').html(str);
 $('#week').html(week)

}
start()

在控制台上可以实时的打印出当前的时间和星期

JavaScript实时更新当前的时间的示例代码

ps:js获取当前时间并实时刷新

效果如图:

JavaScript实时更新当前的时间的示例代码

代码如下:

<html>
  <head>
    <title>js获取当前时间并实时刷新</title>
    <script>
      //页面加载调用
      window.onload=function(){
        //每1秒刷新时间
       setInterval("NowTime()",1000);
      }
      function NowTime(){
        var myDate=new Date();
        var y = myDate.getFullYear();
        var M = myDate.getMonth()+1;   //获取当前月份(0-11,0代表1月)
        var d = myDate.getDate();    //获取当前日(1-31)
        var h = myDate.getHours();    //获取当前小时数(0-23)
        var m = myDate.getMinutes();   //获取当前分钟数(0-59)
        var s = myDate.getSeconds();   //获取当前秒数(0-59)
        
        //检查是否小于10
        M=check(M);
        d=check(d);
        h=check(h);
        m=check(m);
        s=check(s);
        var timestr = y+"-"+M+"-"+d+" "+h+":"+m+":"+s;
        document.getElementById("nowtime").innerHTML="当前时间:" + timestr;
      }
      //时间数字小于10,则在之前加个“0”补位。
      function check(i){
        var num = (i<10)?("0"+i) : i;
        return num;
      }
    </script>
  </head>
  <body>
    <div id="nowtime">在这里显示时间</div>
  </body>
</html>

到此这篇关于JavaScript实时更新当前的时间的文章就介绍到这了,更多相关js 实时更新当前时间内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Prototype使用指南之selector.js
Jan 10 Javascript
javascript parseInt 函数分析(转)
Mar 21 Javascript
JavaScript伸缩的菜单简单示例
Dec 03 Javascript
jquery插件star-rating.js实现星级评分特效
Apr 15 Javascript
jQuery 的 ready()的纯js替代方法
Nov 20 Javascript
关于在vue-cli中使用微信自动登录和分享的实例
Jun 22 Javascript
JavaScript创建对象的七种方式(推荐)
Jun 26 Javascript
jquery对table做排序操作的实例演示
Aug 10 jQuery
微信小程序request请求后台接口php的实例详解
Sep 20 Javascript
JavaScript实现计数器基础方法
Oct 10 Javascript
vue使用监听实现全选反选功能
Jul 06 Javascript
jQuery操作选中select下拉框的值代码实例
Feb 07 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 #jQuery
vue如何在项目中调用腾讯云的滑动验证码
Jul 15 #Javascript
Vue中keep-alive的两种应用方式
Jul 15 #Javascript
js实现浏览器打印功能的示例代码
Jul 15 #Javascript
详解Vue中的MVVM原理和实现方法
Jul 15 #Javascript
详解JavaScript 作用域
Jul 14 #Javascript
如何在Vue中使localStorage具有响应式(思想实验)
Jul 14 #Javascript
You might like
CodeIgniter配置之config.php用法实例分析
2016/01/19 PHP
YII分模块加载路由的实现方法
2018/10/01 PHP
js function定义函数使用心得
2010/04/15 Javascript
jquery实现图片滚动效果的简单实例
2013/11/23 Javascript
JS绘制生成花瓣效果的方法
2015/08/05 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
2016/08/02 Javascript
js实现为a标签添加事件的方法(使用闭包循环)
2016/08/02 Javascript
详解Angularjs在控制器(controller.js)中使用过滤器($filter)格式化日期/时间实例
2017/02/17 Javascript
TypeScript入门-接口
2017/03/30 Javascript
Three.js利用dat.GUI如何简化试验流程详解
2017/09/26 Javascript
AngularJS遍历获取数组元素的方法示例
2017/11/11 Javascript
jQuery ajax仿Google自动提示SearchSuggess功能示例
2019/03/28 jQuery
js设计模式之代理模式及订阅发布模式实例详解
2019/08/15 Javascript
Js参数RSA加密传输之jsencrypt.js的使用
2020/02/07 Javascript
浅谈vue权限管理实现及流程
2020/04/23 Javascript
ES11屡试不爽的新特性,你用上了几个
2020/10/21 Javascript
python实现爬虫统计学校BBS男女比例之数据处理(三)
2015/12/31 Python
用python写扫雷游戏实例代码分享
2018/05/27 Python
简单了解python变量的作用域
2019/07/30 Python
django多种支付、并发订单处理实例代码
2019/12/13 Python
Tensorflow: 从checkpoint文件中读取tensor方式
2020/02/10 Python
以设计师精品品质提供快速时尚:PopJulia
2018/01/09 全球购物
美国葡萄酒网上商店:Martha Stewart Wine Co.
2019/03/17 全球购物
vue路由实现登录拦截
2021/03/24 Vue.js
电信专业毕业生推荐信
2013/11/18 职场文书
门卫人员岗位职责
2013/12/24 职场文书
大学新生军训自我鉴定
2014/03/18 职场文书
党员教师一句话承诺
2014/05/30 职场文书
支部组织生活会方案
2014/06/10 职场文书
群众路线党员个人剖析材料
2014/10/08 职场文书
中学生旷课检讨书2篇
2014/10/09 职场文书
2014年大堂经理工作总结
2014/11/21 职场文书
立项申请报告范本
2015/05/15 职场文书
2019初中学生入团申请书
2019/06/27 职场文书
用python自动生成日历
2021/04/24 Python
Redis实现订单自动过期功能的示例代码
2021/05/08 Redis