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 相关文章推荐
10个基于jQuery或JavaScript的WYSIWYG 编辑器整理
May 06 Javascript
js限制文本框为整数和货币的函数代码
Oct 13 Javascript
简单实用jquery版三级联动select示例
Jul 04 Javascript
JS实现判断滚动条滚到页面底部并执行事件的方法
Dec 18 Javascript
angular.foreach 循环方法使用指南
Jan 06 Javascript
自己编写的支持Ajax验证的JS表单验证插件
May 15 Javascript
jQuery实现Flash效果上下翻动的中英文导航菜单代码
Sep 22 Javascript
javascript瀑布流布局实现方法详解
Feb 17 Javascript
原生js实现可拖动的登录框效果
Jan 21 Javascript
详解vue 配合vue-resource调用接口获取数据
Jun 22 Javascript
javascript数组拍平方法总结
Jan 20 Javascript
Vue表单之v-model绑定下拉列表功能
May 14 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
实现dedecms全站URL静态化改造的代码
2007/03/29 PHP
PHP 学习路线与时间表
2010/02/21 PHP
PHP 函数执行效率的小比较
2010/10/17 PHP
php获取新浪微博数据API实例
2013/11/12 PHP
php查找指定目录下指定大小文件的方法
2014/11/28 PHP
php实现博客,论坛图片防盗链的方法
2016/10/15 PHP
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
2019/12/31 PHP
JavaScript 继承详解(三)
2009/07/13 Javascript
一个用javascript写的select支持上下键、首字母筛选以及回车取值的功能
2009/09/09 Javascript
利用jQuery 实现GridView异步排序、分页的代码
2010/02/06 Javascript
JS截取字符串常用方法整理及使用示例
2013/10/18 Javascript
js 获取时间间隔实现代码
2014/05/12 Javascript
使用js实现数据格式化
2014/12/03 Javascript
javascript实现获取浏览器版本、操作系统类型
2015/01/29 Javascript
javascript中基本类型和引用类型的区别分析
2015/05/12 Javascript
一种angular的方法级的缓存注解(装饰器)
2018/03/13 Javascript
小程序显示弹窗时禁止下层的内容滚动实现方法
2019/03/20 Javascript
js实现窗口全屏示例详解
2019/09/17 Javascript
Vue实现简易计算器
2020/02/25 Javascript
VUE项目axios请求头更改Content-Type操作
2020/07/24 Javascript
js实现随机点名
2021/01/19 Javascript
详解Python中的日志模块logging
2015/06/19 Python
对numpy.append()里的axis的用法详解
2018/06/28 Python
python机器学习之KNN分类算法
2018/08/29 Python
基于pytorch 预训练的词向量用法详解
2020/01/06 Python
pymysql的简单封装代码实例
2020/01/08 Python
基于python爬取有道翻译过程图解
2020/03/31 Python
Python第三方库的几种安装方式(小结)
2020/04/03 Python
Windows下PyCharm配置Anaconda环境(超详细教程)
2020/07/31 Python
python源文件的字符编码知识点详解
2021/03/04 Python
加入学生会演讲稿
2014/04/24 职场文书
网络工程专业大学生求职信
2014/10/01 职场文书
学生检讨书如何写
2014/10/30 职场文书
让子弹飞观后感
2015/06/11 职场文书
小学班级标语口号大全
2015/12/26 职场文书
python代码实现扫码关注公众号登录的实战
2021/11/01 Python