js格式化时间的方法


Posted in Javascript onDecember 18, 2015

本文为大家分享了javascript时间格式化的方法,分享给大家供大家参考,具体内容如下
可以说是Web项目中不可或缺的一个Javascript类库,它可以帮助你快速的解决客户端编程的许多问题,下面贴出一个用js格式化时间的方法。

Date.prototype.format =function(format)
{
var o = {
"M+" : this.getMonth()+1, //month
"d+" : this.getDate(), //day
"h+" : this.getHours(), //hour
"m+" : this.getMinutes(), //minute
"s+" : this.getSeconds(), //second
"q+" : Math.floor((this.getMonth()+3)/3), //quarter
"S" : this.getMilliseconds() //millisecond
}
if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
(this.getFullYear()+"").substr(4- RegExp.$1.length));
for(var k in o)if(new RegExp("("+ k +")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length==1? o[k] :
("00"+ o[k]).substr((""+ o[k]).length));
return format;
}

以上代码必须先声明,然后在使用。使用方法:

var d =new Date().format('yyyy-MM-dd');

另一种方法:

在Javascript之中,日期对象是Date,那么如何将一个日期对象按照定制的格式进行输出呢?
  可以现告诉你,Date对象有有四个内置方法,用于输出为字符串格式,分别为: 

  •   1)toGMTString,将一个日期按照GMT格式显示
  •   2)toLocaleString,将一个日期按照本地操作系统格式显示
  •   3)toLocaleDateString,按照本地格式显示一个日期对象的日期部分
  •   4)toLocaleTimeString,按照本地格式显示一个日期对象的时间部分 

  尽管Javascript的Date对象中内置提供了这些输出为字符串的方法,但是这些字符串不是我们来控制格式的,因此如果我们需要我们自己定制的特殊格式,那么又该怎么办呢?
  不用着急,JsJava中提供了专用的类,专门对日期进行指定格式的字符串输出,你可以下载JsJava-2.0.zip,引入其中的src/jsjava/text/DateFormat.js,或者直接引入jslib/jsjava-2.0.js,样例代码如下:

var df=new SimpleDateFormat();//jsJava1.0需要使用DateFormat对象,不要弄错就是了 
df.applyPattern("yyyy-MM-dd HH:mm:ss"); 
var date=new Date(2015,12,18,10,59,51); 
var str=df.format(date); 
document.write(str);//显示结果为:2015-12-18 10:59:51

通过上面的例子你可以看出,你需要做的就是指定pattern,那么pattern中yyyy、MM等都表示什么意思呢?如果你学习过Java的日期格式化,那么你应该知道,那都是占位符,这些占位符都具有特殊的函数,例如y表示年,yyyy表示四个数字的年份,例如1982,下面列举一些pattern中支持的特殊字符及其含义(下面表格引自Java的官方文档,做了适当修改):

G Era designator [url=]Text[/url] AD 
y Year [url=]Year[/url] 1996; 96 
M Month in year [url=]Month[/url] July; Jul; 07 
w Week in year [url=]Number[/url] 27 
W Week in month [url=]Number[/url] 2 
D Day in year [url=]Number[/url] 189 
d Day in month [url=]Number[/url] 10 
F Day of week in month [url=]Number[/url] 2 
E Day in week [url=]Text[/url] Tuesday; Tue 
a Am/pm marker [url=]Text[/url] PM 
H Hour in day (0-23) [url=]Number[/url] 0 
k Hour in day (1-24) [url=]Number[/url] 24 
K Hour in am/pm (0-11) [url=]Number[/url] 0 
h Hour in am/pm (1-12) [url=]Number[/url] 12 
m Minute in hour [url=]Number[/url] 30 
s Second in minute [url=]Number[/url] 55 
S Millisecond [url=]Number[/url] 978

还有三种方法也分享给大家:

第一种方法:

// 对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 HH:mm:ss");    
var time2 = new Date().format("yyyy-MM-dd");

第二种方法:

<mce: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"));
// --></mce: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 相关文章推荐
javascript+mapbar实现地图定位
Apr 09 Javascript
关于IE BUG与字符串截取substr的解决办法
Apr 10 Javascript
Node.js 服务器端应用开发框架 -- Hapi.js
Jul 29 Javascript
jQuery实现非常实用漂亮的select下拉菜单选择效果
Nov 06 Javascript
字太多用...代替的方法(两种)
Mar 15 Javascript
vue基于Vue2.0和高德地图的地图组件实例
Apr 28 Javascript
JavaScript数据结构学习之数组、栈与队列
May 02 Javascript
vue bootstrap小例子一枚
Jun 09 Javascript
JavaScript你不知道的一些数组方法
Aug 18 Javascript
layui 给数据表格加序号的方法
Aug 20 Javascript
webpack4.0 入门实践教程
Oct 08 Javascript
Vue实现页面添加水印功能
Nov 09 Javascript
谈谈我对JavaScript DOM事件的理解
Dec 18 #Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
Dec 18 #Javascript
jQuery Validation PlugIn的使用方法详解
Dec 18 #Javascript
最简单的JavaScript图片轮播代码(两种方法)
Dec 18 #Javascript
JS弹出对话框实现方法(三种方式)
Dec 18 #Javascript
jQuery Validate表单验证深入学习
Dec 18 #Javascript
JavaScript计划任务后台运行的方法
Dec 18 #Javascript
You might like
PHP4 与 MySQL 数据库操作函数详解
2006/10/09 PHP
使用php+xslt在windows平台上
2006/10/09 PHP
php mysql数据库操作类
2008/06/04 PHP
一步一步学习PHP(6) 面向对象
2010/02/16 PHP
PHP中使用sleep函数实现定时任务实例分享
2014/08/21 PHP
使用PHPMailer实现邮件发送代码分享
2014/10/23 PHP
php中遍历二维数组并以表格的形式输出的方法
2017/01/03 PHP
Yii2.0中使用js异步删除示例
2017/03/10 PHP
php查询内存信息操作示例
2019/05/09 PHP
JavaScript中this关键字使用方法详解
2007/03/08 Javascript
jQuery 使用手册(三)
2009/09/23 Javascript
js去除浏览器默认底图的方法
2015/06/08 Javascript
jquery实现可关闭的倒计时广告特效代码
2015/09/02 Javascript
js代码实现下拉菜单【推荐】
2016/12/15 Javascript
JavaScript数据结构之二叉查找树的定义与表示方法
2017/04/12 Javascript
angularjs实现天气预报功能
2020/06/16 Javascript
React BootStrap用户体验框架快速上手
2018/03/06 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
2019/04/26 Javascript
微信小程序tab切换可滑动切换导航栏跟随滚动实现代码
2019/09/04 Javascript
JS前端基于canvas给图片添加水印
2020/11/11 Javascript
python BeautifulSoup设置页面编码的方法
2015/04/03 Python
python实现简单图片物体标注工具
2019/03/18 Python
PyQT实现菜单中的复制,全选和清空的功能的方法
2019/06/17 Python
opencv 图像礼帽和图像黑帽的实现
2020/07/07 Python
HTML5 video进入全屏和退出全屏的实现方法
2020/07/28 HTML / CSS
英国品牌男装折扣网站:Brown Bag
2018/03/08 全球购物
全球在线商店:BerryLook
2019/04/14 全球购物
波兰多品牌运动商店:StreetStyle24.pl
2020/09/22 全球购物
关于环保的演讲稿
2014/05/10 职场文书
访谈节目策划方案
2014/05/15 职场文书
学生党员一帮一活动总结
2014/07/08 职场文书
法人委托书范本
2014/09/15 职场文书
党员批评与自我批评发言材料
2014/10/14 职场文书
中学生学习保证书
2015/02/26 职场文书
因工资原因离职的辞职信范文
2015/05/12 职场文书
《1942》观后感
2015/06/08 职场文书