JS使用Date对象实时显示当前系统时间简单示例


Posted in Javascript onAugust 23, 2018

本文实例讲述了JS使用Date对象实时显示当前系统时间的方法。分享给大家供大家参考,具体如下:

JS中包含Date对象,其提供了一些方法获取系统日期,直接上代码:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>3water.com 获取系统时间</title>
    <script language="JavaScript">
      function realSysTime(clock) {
        var now = new Date();
        var year = now.getFullYear(); //获取年份
        var month = now.getMonth(); //获取月份
        var date = now.getDate(); //获取日期
        var day = now.getDay(); //获取星期
        var hour = now.getHours(); //获取小时
        var minute = now.getMinutes(); //获取分钟
        var seconds = now.getSeconds(); //获取秒
        month = month + 1;
        var arr_week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
        var week = arr_week[day];
        var time = year + "年" + month + "月" + date + "日 " + week + " " + hour + ":" + minute + ":" + seconds;
        clock.innerHTML = "当前时间:" + time;
      }
      function show() {
        window.setInterval("realSysTime(clock)", 1000);
      }
    </script>
  </head>
    <body>
        <div id='clock'></div>
        <script> 
        window.onload=show()
        </script>
    </body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试运行结果如下:

JS使用Date对象实时显示当前系统时间简单示例

Javascript 相关文章推荐
jquery中页面Ajax方法$.load的功能使用介绍
Oct 20 Javascript
基于javascript实现最简单的选项卡切换效果
May 16 Javascript
修改jquery中dialog的title属性方法(推荐)
Aug 26 Javascript
jQuery插件echarts实现的多柱子柱状图效果示例【附demo源码下载】
Mar 04 Javascript
vue学习教程之带你一步步详细解析vue-cli
Dec 26 Javascript
JS中实现浅拷贝和深拷贝的代码详解
Jun 05 Javascript
Vue.js自定义指令学习使用详解
Oct 19 Javascript
Vue路由的模块自动化与统一加载实现
Jun 05 Javascript
在Vue 中获取下拉框的文本及选项值操作
Aug 13 Javascript
vue 避免变量赋值后双向绑定的操作
Nov 07 Javascript
javascript全局自定义鼠标右键菜单
Dec 08 Javascript
JS实现京东商品分类侧边栏
Dec 11 Javascript
React key值的作用和使用详解
Aug 23 #Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
Aug 23 #Javascript
从零开始学习搭建React脚手架项目
Aug 23 #Javascript
angular2 ng2-file-upload上传示例代码
Aug 23 #Javascript
Angular angular-file-upload文件上传的示例代码
Aug 23 #Javascript
JS实现的简单分页功能示例
Aug 23 #Javascript
JavaScript实用代码小技巧
Aug 23 #Javascript
You might like
PHP新手上路(三)
2006/10/09 PHP
兼容性最强的PHP生成缩略图的函数代码(修改版)
2011/01/18 PHP
理解和运用PHP中的多态性[译]
2011/08/02 PHP
PHP网页安全认证的实例详解
2017/09/28 PHP
js null undefined 空区别说明
2010/06/13 Javascript
jQuery实战之仿淘宝商城左侧导航效果
2011/04/12 Javascript
javascript面向对象入门基础详细介绍
2012/09/05 Javascript
jQuery ajax serialize() 方法使用示例
2014/11/02 Javascript
Javascript闭包实例详解
2015/11/29 Javascript
JavaScript获取当前cpu使用率的方法
2015/12/15 Javascript
基于Cookie常用操作以及属性介绍
2017/09/07 Javascript
限时抢购-倒计时的完整实例(分享)
2017/09/17 Javascript
浅谈函数调用的不同方式,以及this的指向
2017/09/17 Javascript
vue实现键盘输入支付密码功能
2018/08/18 Javascript
Python中的对象,方法,类,实例,函数用法分析
2015/01/15 Python
Python列表推导式、字典推导式与集合推导式用法实例分析
2018/02/07 Python
解决Pycharm无法import自己安装的第三方module问题
2018/05/18 Python
解决每次打开pycharm直接进入项目的问题
2018/10/28 Python
pyqt5 实现工具栏文字图片同时显示
2019/06/13 Python
教你如何编写、保存与运行Python程序的方法
2019/07/12 Python
Python AutoCAD 系统设置的实现方法
2020/04/01 Python
python使用OpenCV模块实现图像的融合示例代码
2020/04/10 Python
详解scrapy内置中间件的顺序
2020/09/28 Python
详解Html5 Canvas画线有毛边解决方法
2018/03/01 HTML / CSS
英国豪华家具和家居用品购物网站:Teddy Beau
2020/10/12 全球购物
长辈证婚人证婚词
2014/01/09 职场文书
期末自我鉴定
2014/01/23 职场文书
专家推荐信模板
2014/05/09 职场文书
煤矿安全协议书
2014/08/20 职场文书
学校党员个人问题整改措施思想汇报
2014/10/08 职场文书
2014学习十八届四中全会精神思想汇报范文
2014/10/23 职场文书
教师见习报告范文
2014/11/03 职场文书
美丽心灵观后感
2015/06/01 职场文书
CSS 圆形进度栏
2021/04/06 HTML / CSS
python用字节处理文件实例讲解
2021/04/13 Python
JavaScript 中for/of,for/in 的详细介绍
2021/11/17 Javascript