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 AutoScroller 函数类
May 29 Javascript
用json方式实现在 js 中建立一个map
May 02 Javascript
详解JavaScript中Date.UTC()方法的使用
Jun 12 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
Jul 06 Javascript
JavaScript函数基础详解
Feb 03 Javascript
Web开发中客户端的跳转与服务器端的跳转的区别
Mar 05 Javascript
zTree实现节点修改的实时刷新功能
Mar 20 Javascript
yarn的使用与升级Node.js的方法详解
Jun 04 Javascript
在vue项目中使用element-ui的Upload上传组件的示例
Feb 08 Javascript
Angular ng-animate和ng-cookies用法详解
Apr 18 Javascript
详解js获取video任意时间的画面截图
Apr 17 Javascript
微信小程序云开发之数据库操作
May 18 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和XSS跨站攻击的防范
2007/04/17 PHP
Discuz 模板语句分析及知识技巧
2009/08/21 PHP
PHP 基本语法格式
2009/12/15 PHP
php中设置index.php文件为只读的方法
2013/02/06 PHP
PHP中Restful api 错误提示返回值实现思路
2016/04/12 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
PHP生成word文档的三种实现方式
2016/11/14 PHP
yii框架搜索分页modle写法
2016/12/19 PHP
Thinkphp5框架实现获取数据库数据到视图的方法
2019/08/14 PHP
JavaScript代码复用模式实例分析
2012/12/02 Javascript
浅谈angularJS中的事件
2016/07/12 Javascript
前端 Vue.js 和 MVVM 详细介绍
2016/12/29 Javascript
JS对象深度克隆实例分析
2017/03/16 Javascript
Vue.js学习笔记之常用模板语法详解
2017/07/25 Javascript
详解Vue双向数据绑定原理解析
2017/09/11 Javascript
微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法
2017/12/14 Javascript
Vue自定义指令实现checkbox全选功能的方法
2018/02/28 Javascript
手写简单的jQuery雪花飘落效果实例
2018/04/22 jQuery
vue router 跳转时打开新页面的示例方法
2019/07/28 Javascript
[05:13]2018DOTA2亚洲邀请赛主赛事第二日战况回顾 LGD、VG双雄携手晋级
2018/04/05 DOTA
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
python下函数参数的传递(参数带星号的说明)
2010/09/19 Python
python线程池threadpool实现篇
2018/04/27 Python
python实现简易数码时钟
2021/02/19 Python
Python实现二叉树的最小深度的两种方法
2019/09/30 Python
Django实现文件上传下载
2019/10/06 Python
Tensorflow设置显存自适应,显存比例的操作
2020/02/03 Python
用css3写出气球样式的示例代码
2017/09/11 HTML / CSS
DNA测试:Orig3n
2019/03/01 全球购物
毕业生多媒体设计求职信
2013/10/12 职场文书
淘宝活动策划方案
2014/02/06 职场文书
恶搞卫生巾广告词
2014/03/18 职场文书
2014年监理个人工作总结
2014/12/11 职场文书
行政撤诉申请书
2015/05/18 职场文书
2015年新农村建设工作总结
2015/05/22 职场文书
Redis超详细讲解高可用主从复制基础与哨兵模式方案
2022/04/07 Redis