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 相关文章推荐
jquery简单体验
Jan 10 Javascript
通过DOM脚本去设置样式信息
Sep 19 Javascript
jQuery 获取URL的GET参数值的小例子
Apr 18 Javascript
js对象与打印对象分析比较
Apr 23 Javascript
JS返回iframe中frameBorder属性值的方法
Apr 01 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
May 19 Javascript
javascript中checkbox使用方法简单实例演示
Nov 17 Javascript
浅谈JavaScript中的分支结构
Jul 01 Javascript
bootstrap table实例详解
Jan 06 Javascript
vue实现仿淘宝结账页面实例代码
Nov 08 Javascript
详解json串反转义(消除反斜杠)
Aug 12 Javascript
Ajax实现页面无刷新留言效果
Mar 24 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 中的输出缓冲
2006/12/21 PHP
各种快递查询--Api接口
2016/04/26 PHP
javascript里模拟sleep(两种实现方式)
2013/01/25 Javascript
node.js中的fs.chown方法使用说明
2014/12/16 Javascript
jQuery子窗体取得父窗体元素的方法
2015/05/11 Javascript
浅谈JavaScript中的字符编码转换问题
2015/07/07 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
2015/07/28 Javascript
jquery插件jquery.confirm弹出确认消息
2015/12/22 Javascript
41个Web开发者必须收藏的JavaScript实用技巧
2016/07/22 Javascript
AngularJS入门教程之迭代器过滤详解
2016/08/18 Javascript
JS+HTML5 FileReader对象用法示例
2017/04/07 Javascript
Nodejs之TCP服务端与客户端聊天程序详解
2017/07/07 NodeJs
jquery+css3实现熊猫tv导航代码分享
2018/02/12 jQuery
解决LayUI表单获取不到data的问题
2018/08/20 Javascript
快速解决vue-cli在ie9+中无效的问题
2018/09/04 Javascript
用WebStorm进行Angularjs 2开发(环境篇:Windows 10,Angular-cli方式)
2018/12/05 Javascript
Nodejs中怎么实现函数的串行执行
2019/03/02 NodeJs
vue实现登录页面的验证码以及验证过程解析(面向新手)
2019/08/02 Javascript
使用layui定义一个模块并使用的例子
2019/09/14 Javascript
使用typescript改造koa开发框架的实现
2020/02/04 Javascript
[00:58]2016年国际邀请赛勇士令状宣传片
2016/06/01 DOTA
Selenium控制浏览器常见操作示例
2018/08/13 Python
Centos下实现安装Python3.6和Python2共存
2018/08/15 Python
Python实现微信自动好友验证,自动回复,发送群聊链接方法
2019/02/21 Python
Python操作列表常用方法实例小结【创建、遍历、统计、切片等】
2019/10/25 Python
Python箱型图处理离群点的例子
2019/12/09 Python
Python创建空列表的字典2种方法详解
2020/02/13 Python
Python 爬取必应壁纸的实例讲解
2020/02/24 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
css3实现冲击波效果的示例代码
2018/01/11 HTML / CSS
StubHub新加坡:购买和出售全球活动门票
2017/03/10 全球购物
linux面试题参考答案(8)
2015/08/11 面试题
学校十一活动方案
2014/02/01 职场文书
个人课题方案
2014/05/08 职场文书
2014年应急管理工作总结
2014/11/26 职场文书
爱国电影观后感
2015/06/19 职场文书