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 相关文章推荐
新老版本juqery获取radio对象的方法
Mar 01 Javascript
javascript 获取页面的高度及滚动条的位置的代码
May 06 Javascript
用jquery的方法制作一个简单的导航栏
Jun 23 Javascript
Bootstrap Search Suggest使用例子
Dec 21 Javascript
Vue.js实现价格计算器功能
Mar 30 Javascript
vue router下的html5 history在iis服务器上的设置方法
Oct 18 Javascript
浅谈VueJS SSR 后端绘制内存泄漏的相关解决经验
Dec 20 Javascript
vue组件中watch props根据v-if动态判断并挂载DOM的问题
May 12 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
Oct 30 Javascript
JS实现的雪花飘落特效示例
Dec 03 Javascript
vue3.0封装轮播图组件的步骤
Mar 04 Vue.js
手写Spirit防抖函数underscore和节流函数lodash
Mar 22 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执行zip与rar解压缩方法实现代码
2010/12/05 PHP
PHP排序算法的复习和总结
2012/02/15 PHP
php观察者模式应用场景实例详解
2017/02/03 PHP
基于jquery的关于动态创建DOM元素的问题
2010/12/24 Javascript
JavaScript 放大镜 移动镜片效果代码
2011/05/09 Javascript
探讨js中的双感叹号判断
2013/11/11 Javascript
javascript学习笔记(五)原型和原型链详解
2014/10/08 Javascript
JavaScript实现广告的关闭与显示效果实例
2015/07/02 Javascript
推荐10 个很棒的 jQuery 特效代码
2015/10/04 Javascript
Vue.js每天必学之方法与事件处理器
2016/09/06 Javascript
理解javascript中的闭包
2017/01/11 Javascript
JS图片压缩(pc端和移动端都适用)
2017/01/12 Javascript
详解基于 Nuxt 的 Vue.js 服务端渲染实践
2017/10/24 Javascript
layui 监听表格复选框选中值的方法
2018/08/15 Javascript
微信小程序实现搜索功能并跳转搜索结果页面
2019/05/18 Javascript
Node.js 的 GC 机制详解
2019/06/03 Javascript
Vue使用Proxy监听所有接口状态的方法实现
2019/06/07 Javascript
将Python中的数据存储到系统本地的简单方法
2015/04/11 Python
python实现一次创建多级目录的方法
2015/05/15 Python
详解Python Socket网络编程
2016/01/05 Python
基于python实现的抓取腾讯视频所有电影的爬虫
2016/04/22 Python
小米5s微信跳一跳小程序python源码
2018/01/08 Python
python matplotlib 注释文本箭头简单代码示例
2018/01/08 Python
Python 删除连续出现的指定字符的实例
2018/06/29 Python
django利用request id便于定位及给日志加上request_id
2018/08/26 Python
python-numpy-指数分布实例详解
2019/12/07 Python
python爬虫学习笔记之pyquery模块基本用法详解
2020/04/09 Python
Python闭包与装饰器原理及实例解析
2020/04/30 Python
Python连接HDFS实现文件上传下载及Pandas转换文本文件到CSV操作
2020/06/06 Python
python+selenium爬取微博热搜存入Mysql的实现方法
2021/01/27 Python
美的官方商城:Midea
2016/09/14 全球购物
毕业生简单求职信
2013/11/19 职场文书
2014年财务部工作总结
2014/11/11 职场文书
入党积极分子培养人意见
2015/06/02 职场文书
分析MySQL抛出异常的几种常见解决方式
2021/05/18 MySQL
python-opencv 中值滤波{cv2.medianBlur(src, ksize)}的用法
2021/06/05 Python