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.js常用函数及其用法
Mar 10 Javascript
javascript 支持链式调用的异步调用框架Async.Operation
Aug 04 Javascript
jquery post方式传递多个参数值后台以数组的方式进行接收
Jan 11 Javascript
Javascript中valueOf与toString区别浅析
Mar 19 Javascript
jQuery使用append在html元素后同时添加多项内容的方法
Mar 26 Javascript
跟我学习javascript的基本类型和引用类型
Nov 16 Javascript
jQuery如何封装输入框插件
Aug 19 Javascript
简单的vue-resourse获取json并应用到模板示例
Feb 10 Javascript
Javascript中Promise的四种常用方法总结
Jul 14 Javascript
bootstrap时间控件daterangepicker使用方法及各种小bug修复
Oct 25 Javascript
JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】
Feb 06 Javascript
JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析
Mar 02 Javascript
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
PHP手机短信验证码实现流程详解
2018/05/17 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
json-lib出现There is a cycle in the hierarchy解决办法
2010/02/24 Javascript
ASP.NET中AJAX 调用实例代码
2012/05/03 Javascript
判断字符串的长度(优化版)中文占两个字符
2014/10/30 Javascript
WEB前端设计师常用工具集锦
2014/12/09 Javascript
JavaScript实现彩虹文字效果的方法
2015/04/16 Javascript
解决微信浏览器Javascript无法使用window.location.reload()刷新页面
2016/06/21 Javascript
nodejs读写json文件的简单方法(必看)
2017/03/09 NodeJs
JavaScript多态与封装实例分析
2018/07/27 Javascript
vue动态删除从数据库倒入列表的某一条方法
2018/09/29 Javascript
JS实现的排列组合算法示例
2019/07/16 Javascript
js实现弹幕飞机效果
2020/08/27 Javascript
vue中watch的用法汇总
2020/12/28 Vue.js
Python编码时应该注意的几个情况
2013/03/04 Python
在Docker上部署Python的Flask框架的教程
2015/04/08 Python
用Python编写web API的教程
2015/04/30 Python
python实现闹钟定时播放音乐功能
2018/01/25 Python
python获取代码运行时间的实例代码
2018/06/11 Python
Python实现AI自动抠图实例解析
2020/03/05 Python
django orm模块中的 is_delete用法
2020/05/20 Python
基于Python采集爬取微信公众号历史数据
2020/11/27 Python
如何使用canvas绘制可移动网格的示例代码
2020/12/14 HTML / CSS
美国领先的汽车轮胎和轮毂供应商:TireBuyer
2016/07/21 全球购物
Expedia西班牙:预订酒店、机票、旅行和廉价度假套餐
2019/04/10 全球购物
匈牙利超级网上商店和优惠:Alza.hu
2019/12/17 全球购物
刘胡兰的英雄事迹材料
2014/02/11 职场文书
《风娃娃》教学反思
2014/04/19 职场文书
工地安全生产标语
2014/06/06 职场文书
社保委托书怎么写
2014/08/02 职场文书
小学校园文化建设汇报材料
2014/08/19 职场文书
向国旗敬礼活动总结
2014/09/27 职场文书
2015年银行员工工作总结
2015/04/24 职场文书
2015年物资管理工作总结
2015/05/20 职场文书
2016年小学生寒假总结
2015/10/10 职场文书
tensorflow学习笔记之tfrecord文件的生成与读取
2021/03/31 Python