JS获取当前日期时间并定时刷新示例


Posted in Javascript onMarch 04, 2021

JS获取当前日期时间

var date = new Date(); 
date.getYear(); //获取当前年份(2位) 
date.getFullYear(); //获取完整的年份(4位,2014) 
date.getMonth(); //获取当前月份(0-11,0代表1月) 
date.getDate(); //获取当前日(1-31) 
date.getDay(); //获取当前星期X(0-6,0代表星期天) 
date.getTime(); //获取当前时间(从1970.1.1开始的毫秒数) 
date.getHours(); //获取当前小时数(0-23) 
date.getMinutes(); //获取当前分钟数(0-59) 
date.getSeconds(); //获取当前秒数(0-59) 
date.getMilliseconds(); //获取当前毫秒数(0-999) 
date.toLocaleDateString(); //获取当前日期 如 2014年6月25日 
date.toLocaleTimeString(); //获取当前时间 如 下午4:45:06 
date.toLocaleString(); //获取日期与时间 如 2014年6月25日 下午4:45:06

注意:getYear()和getFullYear()都可以获取年份,但两者稍有区别

getYear()在浏览器中显示则为:114 (以2014年为例),原因则是getYear返回的是"当前年份-1900"的值(即年份基数是1900)

使用JS来获取年份都使用:getFullYear()

getMonth()需要加1,如下面的函数

// 获取当前日期时间
function getDatetime() {
  var now = new Date();
  var year = now.getFullYear();    
  var month = now.getMonth() + 1;   
  var day = now.getDate();      
  var hh = now.getHours();      
  var mm = now.getMinutes();     
  var ss = now.getSeconds();     
  var clock = year + "-";
  if (month < 10)
    clock += "0";
  clock += month + "-";
  if (day < 10)
    clock += "0";
  clock += day + " ";
  if (hh < 10)
    clock += "0";
  clock += hh + ":";
  if (mm < 10) clock += '0';
  clock += mm + ":";
  if (ss < 10) clock += '0';
  clock += ss;
  return clock;
}
// 获取当前日期时间
function timestampToTime(timestamp) {
  var date = new Date(timestamp);
  var Y = date.getFullYear() + '-';
  var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() + ' ';
  var hh = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() + ':';
  var mm = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() + ':';
  var ss = date.getSeconds() < 10 ? '0' + date.getDate() : date.getSeconds() ;
  return Y + M + D + hh + mm + ss;
}

定时刷新

定时刷新则使用setInterval,具体setTimeout与setInterval的区别参考其他资料。

1、首先页面需要一区域用于显示时间

<div id="showDate"></div>

2、获取时间

<script type="text/javascript"> 
$(function(){ 
setInterval("getTime();",1000); //每隔一秒执行一次 
}) 
//取得系统当前时间 
function getTime(){ 
var myDate = new Date(); 
var date = myDate.toLocaleDateString(); 
var hours = myDate.getHours(); 
var minutes = myDate.getMinutes(); 
var seconds = myDate.getSeconds(); 
$("#showDate").html(date+" "+hours+":"+minutes+":"+seconds); //将值赋给div 
} 
</script>

使用toLocaleDateString()直接获取年月日,不需要再单独获取年、月、日

而toLocaleTimeString()可直接获取时分秒,由于它获取的格式不是需要的。于是可单独获取。

Javascript 相关文章推荐
Javascript中的常见排序算法
Mar 27 Javascript
Jquery实战_读书笔记1—选择jQuery
Jan 22 Javascript
IE下JS读取xml文件示例代码
Aug 05 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
Jan 03 Javascript
js 通过html()及text()方法获取并设置p标签的显示值
May 14 Javascript
jquery遍历函数siblings()用法实例
Dec 24 Javascript
javascript实现方法调用与方法触发小结
Mar 26 Javascript
JavaScript知识点总结(十六)之Javascript闭包(Closure)代码详解
May 31 Javascript
jQuery 判断元素整理汇总
Feb 28 Javascript
Vue.js特性Scoped Slots的浅析
Feb 20 Javascript
微信小程序实现横向滚动导航栏效果
Dec 12 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
Feb 21 Javascript
使用ajaxfileupload.js实现ajax上传文件php版
Jun 26 #Javascript
一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子
Jun 26 #Javascript
php读取sqlite数据库入门实例代码
Jun 25 #Javascript
javascript基于HTML5 canvas制作画箭头组件
Jun 25 #Javascript
node.js学习总结之调式代码的方法
Jun 25 #Javascript
javascript获取元素偏移量的方法有哪些
Jun 24 #Javascript
Jquery之Bind方法参数传递与接收的三种方法
Jun 24 #Javascript
You might like
php使用qr生成二维码的示例分享
2014/01/20 PHP
PHP面向对象程序设计中的self、static、parent关键字用法分析
2019/08/14 PHP
JavaScript 字符串连接性能优化
2008/12/20 Javascript
来自国外的30个基于jquery的Web下拉菜单
2012/06/22 Javascript
javascript当中的代码嗅探扩展原生对象和原型(prototype)
2013/01/11 Javascript
如何实现textarea里的不同文本显示不同颜色
2014/01/20 Javascript
Jquery获得控件值的三种方法总结
2014/02/13 Javascript
javascript实现简单的html5视频播放器
2015/05/06 Javascript
javascript委托(Delegate)blur和focus用法实例分析
2015/05/26 Javascript
JS组件中bootstrap multiselect两大组件较量
2016/01/26 Javascript
javascript 小数乘法结果错误的处理方法
2016/07/28 Javascript
JS实现获取当前URL和来源URL的方法
2016/08/24 Javascript
关于json字符串与实体之间的严格验证代码
2016/11/10 Javascript
jquery mobile移动端幻灯片滑动切换效果
2020/04/15 Javascript
Angular2中select用法之设置默认值与事件详解
2017/05/07 Javascript
node.js基础知识小结
2018/02/26 Javascript
CKEditor4配置与开发详细中文说明文档
2018/10/08 Javascript
Python中的特殊语法:filter、map、reduce、lambda介绍
2015/04/14 Python
Python多进程机制实例详解
2015/07/02 Python
详谈python3 numpy-loadtxt的编码问题
2018/04/29 Python
解决phantomjs截图失败,phantom.exit位置的问题
2018/05/17 Python
python使用Matplotlib画饼图
2018/09/25 Python
python pygame模块编写飞机大战
2018/11/20 Python
python调用百度地图WEB服务API获取地点对应坐标值
2019/01/16 Python
flask应用部署到服务器的方法
2019/07/12 Python
Python持续监听文件变化代码实例
2020/07/22 Python
python 线程的五个状态
2020/09/22 Python
CSS3过渡transition效果实例介绍
2016/05/03 HTML / CSS
Diamondback自行车:拥有你的冒险
2019/04/22 全球购物
演讲比赛获奖感言
2014/02/02 职场文书
揭牌仪式主持词
2014/03/19 职场文书
中班上学期幼儿评语
2014/04/30 职场文书
地震捐款倡议书
2014/08/29 职场文书
2014年党员自我评价材料
2014/09/22 职场文书
作风整顿个人剖析材料
2014/10/06 职场文书
2016清明节森林防火广播稿
2015/12/17 职场文书