JavaScript 中Date对象的格式化代码方法汇总


Posted in Javascript onSeptember 06, 2017

 JavaScript默认的时间格式我们一般情况下不会用,所以需要进行格式化,下面说说我总结的JavaScript时间格式化方法。

很多时候,我们可以利用JavaScript中Date对象的内置方法来格式化,如:

var d = new Date();
console.log(d); // 输出:Mon Nov 04 2013 21:50:33 GMT+0800 (中国标准时间)
console.log(d.toDateString()); // 日期字符串,输出:Mon Nov 04 2013
console.log(d.toGMTString()); // 格林威治时间,输出:Mon, 04 Nov 2013 14:03:05 GMT
console.log(d.toISOString()); // 国际标准组织(ISO)格式,输出:2013-11-04T14:03:05.420Z
console.log(d.toJSON()); // 输出:2013-11-04T14:03:05.420Z
console.log(d.toLocaleDateString()); // 转换为本地日期格式,视环境而定,输出:2013年11月4日
console.log(d.toLocaleString()); // 转换为本地日期和时间格式,视环境而定,输出:2013年11月4日 下午10:03:05
console.log(d.toLocaleTimeString()); // 转换为本地时间格式,视环境而定,输出:下午10:03:05
console.log(d.toString()); // 转换为字符串,输出:Mon Nov 04 2013 22:03:05 GMT+0800 (中国标准时间)
console.log(d.toTimeString()); // 转换为时间字符串,输出:22:03:05 GMT+0800 (中国标准时间)
console.log(d.toUTCString()); // 转换为世界时间,输出:Mon, 04 Nov 2013 14:03:05 GMT

如果上面的方法不能满足我们的要求,也可以自定义函数来格式化时间,如:

 方法一:

// 对Date的扩展,将 Date 转化为指定格式的String
// 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符,
// 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
// 例子:
// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
// (new Date()).Format("yyyy-M-d h:m:s.S")   ==> 2006-7-2 8:9:4.18
Date.prototype.Format = function (fmt) { //author: meizz
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}

调用:

var time1 = new Date().Format(“yyyy-MM-dd”); 
var time2 = new Date().Format(“yyyy-MM-dd HH:mm:ss”);

方法二:

<script language="javascript" type="text/javascript">
<!-- /** * 对Date的扩展,将 Date 转化为指定格式的String * 月(M)、日(d)、12小时(h)、24小时(H)、分(m)、秒(s)、周(E)、季度(q)
可以用 1-2 个占位符 * 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) * eg: * (new
Date()).pattern("yyyy-MM-dd hh:mm:ss.S")==> 2006-07-02 08:09:04.423
* (new Date()).pattern("yyyy-MM-dd E HH:mm:ss") ==> 2009-03-10 二 20:09:04
* (new Date()).pattern("yyyy-MM-dd EE hh:mm:ss") ==> 2009-03-10 周二 08:09:04
* (new Date()).pattern("yyyy-MM-dd EEE hh:mm:ss") ==> 2009-03-10 星期二 08:09:04
* (new Date()).pattern("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18
*/
Date.prototype.pattern=function(fmt) {
var o = {
"M+" : this.getMonth()+1, //月份
"d+" : this.getDate(), //日
"h+" : this.getHours()%12 == 0 ? 12 : this.getHours()%12, //小时
"H+" : this.getHours(), //小时
"m+" : this.getMinutes(), //分
"s+" : this.getSeconds(), //秒
"q+" : Math.floor((this.getMonth()+3)/3), //季度
"S" : this.getMilliseconds() //毫秒
};
var week = {
"0" : "/u65e5",
"1" : "/u4e00",
"2" : "/u4e8c",
"3" : "/u4e09",
"4" : "/u56db",
"5" : "/u4e94",
"6" : "/u516d"
};
if(/(y+)/.test(fmt)){
fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
}
if(/(E+)/.test(fmt)){
fmt=fmt.replace(RegExp.$1, ((RegExp.$1.length>1) ? (RegExp.$1.length>2 ? "/u661f/u671f" : "/u5468") : "")+week[this.getDay()+""]);
}
for(var k in o){
if(new RegExp("("+ k +")").test(fmt)){
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
}
}
return fmt;
}
var date = new Date();
window.alert(date.pattern("yyyy-MM-dd hh:mm:ss"));
// -->
</script>

方法三:

Date.prototype.format = function (mask) {
var d = this;
var zeroize = function (value, length) {
if (!length) length = 2;
value = String(value);
for (var i = 0, zeros = ''; i < (length - value.length); i++) {
zeros += '0';
}
return zeros + value;
};
return mask.replace(/"[^"]*"|'[^']*'|/b ( ? : d {
1, 4
} | m {
1, 4
} | yy( ? : yy) ? | ([hHMstT]) / 1 ? | [lLZ]) / b / g, function ($0) {
switch ($0) {
case 'd':
return d.getDate();
case 'dd':
return zeroize(d.getDate());
case 'ddd':
return ['Sun', 'Mon', 'Tue', 'Wed', 'Thr', 'Fri', 'Sat'][d.getDay()];
case 'dddd':
return ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'][d.getDay()];
case 'M':
return d.getMonth() + 1;
case 'MM':
return zeroize(d.getMonth() + 1);
case 'MMM':
return ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][d.getMonth()];
case 'MMMM':
return ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'][d.getMonth()];
case 'yy':
return String(d.getFullYear()).substr(2);
case 'yyyy':
return d.getFullYear();
case 'h':
return d.getHours() % 12 || 12;
case 'hh':
return zeroize(d.getHours() % 12 || 12);
case 'H':
return d.getHours();
case 'HH':
return zeroize(d.getHours());
case 'm':
return d.getMinutes();
case 'mm':
return zeroize(d.getMinutes());
case 's':
return d.getSeconds();
case 'ss':
return zeroize(d.getSeconds());
case 'l':
return zeroize(d.getMilliseconds(), 3);
case 'L':
var m = d.getMilliseconds();
if (m > 99) m = Math.round(m / 10);
return zeroize(m);
case 'tt':
return d.getHours() < 12 ? 'am' : 'pm';
case 'TT':
return d.getHours() < 12 ? 'AM' : 'PM';
case 'Z':
return d.toUTCString().match(/[A-Z]+$/);
// Return quoted strings with the surrounding quotes removed
default:
return $0.substr(1, $0.length - 2);
}
});
};

总结

以上所述是小编给大家介绍的JavaScript 中Date对象的格式化代码方法汇总,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
一个js封装的不错的选项卡效果代码
Feb 15 Javascript
jQuery移除元素自动解绑事件实现思路及代码
May 31 Javascript
浅谈Javascript数组索引
Jul 29 Javascript
JavaScript实现的经典文件树菜单效果
Sep 08 Javascript
jQuery中通过ajax的get()函数读取页面的方法
Feb 29 Javascript
jQuery中DOM节点删除之empty与remove
Jan 20 Javascript
jQuery源码分析之sizzle选择器详解
Feb 13 Javascript
vue中用动态组件实现选项卡切换效果
Mar 25 Javascript
JavaScrip数组删除特定元素的几种方法总结
Sep 06 Javascript
Vue项目pdf(base64)转图片遇到的问题及解决方法
Oct 19 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
Dec 12 Javascript
create-react-app中添加less支持的实现
Nov 15 Javascript
jquery实现限制textarea输入字数的方法
Sep 06 #jQuery
Vue的百度地图插件尝试使用
Sep 06 #Javascript
表格展示利器 Bootstrap Table实例代码
Sep 06 #Javascript
javascript如何用递归写一个简单的树形结构示例
Sep 06 #Javascript
jquery实现用户登陆界面(示例讲解)
Sep 06 #jQuery
详谈js原型继承的一些问题
Sep 06 #Javascript
浅谈react.js中实现tab吸顶效果的问题
Sep 06 #Javascript
You might like
全国FM电台频率大全 - 1 北京市
2020/03/11 无线电
解析mysql left( right ) join使用on与where筛选的差异
2013/06/18 PHP
PHP的Yii框架中过滤器相关的使用总结
2016/03/29 PHP
PHP实现的基于单向链表解决约瑟夫环问题示例
2017/09/30 PHP
Laravel核心解读之异常处理的实践过程
2019/02/24 PHP
用js重建星际争霸
2006/12/22 Javascript
jquery学习笔记二 实现可编辑的表格
2010/04/09 Javascript
jquery实现表格奇数偶数行不同样式(有图为证及实现代码)
2013/01/23 Javascript
js拖动div 当鼠标移动时整个div也相应的移动
2013/11/21 Javascript
jQuery设置和移除文本框默认值的方法
2015/03/09 Javascript
JS实现控制表格单元格垂直对齐的方法
2015/03/30 Javascript
js支持键盘控制的左右切换立体式图片轮播效果代码分享
2015/08/26 Javascript
浅析BootStrap Treeview的简单使用
2016/10/12 Javascript
javascript编程实现栈的方法详解【经典数据结构】
2017/04/11 Javascript
vuejs使用FormData实现ajax上传图片文件
2017/08/08 Javascript
Vue 2.0入门基础知识之内部指令详解
2017/10/15 Javascript
JS实现碰撞检测的方法分析
2018/01/19 Javascript
Angular(5.2-&gt;6.1)升级小结
2018/12/27 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
2019/01/25 Javascript
vue计算属性computed的使用方法示例
2019/03/13 Javascript
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
2019/08/03 Javascript
Python Queue模块详解
2014/11/30 Python
python实现简单神经网络算法
2018/03/10 Python
python梯度下降法的简单示例
2018/08/31 Python
详解django自定义中间件处理
2018/11/21 Python
Python解决pip install时出现的Could not fetch URL问题
2019/08/01 Python
Mysql数据库反向生成Django里面的models指令方式
2020/05/18 Python
浅谈keras通过model.fit_generator训练模型(节省内存)
2020/06/17 Python
CSS3中伪元素::before和::after的用法示例
2017/09/18 HTML / CSS
html5菜单折纸效果
2014/04/22 HTML / CSS
美国瑜伽品牌:Gaiam
2017/10/31 全球购物
英国最大的独立摄影零售商:Park Cameras
2019/11/27 全球购物
什么是"引用"?申明和使用"引用"要注意哪些问题?
2016/03/03 面试题
临床专业自荐信
2014/06/22 职场文书
医务人员医德考评自我评价
2015/03/03 职场文书
Vue3.0中Ref与Reactive的区别示例详析
2021/07/07 Vue.js