JS格式化时间的几种方法总结

 更新时间:2022年04月26日 11:22:29   投稿:yangbin  
这篇文章介绍了JS格式化时间的方法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

方法一

方法

//格式化时间
function format(dat){
    //获取年月日,时间
    var year = dat.getFullYear();
    var mon = (dat.getMonth()+1) < 10 ? "0"+(dat.getMonth()+1) : dat.getMonth()+1;
    var data = dat.getDate()  < 10 ? "0"+(dat.getDate()) : dat.getDate();
    var hour = dat.getHours()  < 10 ? "0"+(dat.getHours()) : dat.getHours();
    var min =  dat.getMinutes()  < 10 ? "0"+(dat.getMinutes()) : dat.getMinutes();
    var seon = dat.getSeconds() < 10 ? "0"+(dat.getSeconds()) : dat.getSeconds();
				
    var newDate = year +"-"+ mon +"-"+ data +" "+ hour +":"+ min +":"+ seon;
    return newDate;
}

调用

//获取时间
var dat = new Date();	
//格式化时间
var newDate = format(dat);

方法二

/**
 * 格式化日期
 * @param {string | number | Date} value 指定日期
 * @param {string} format 格式化的规则
 * @example
 * ```js
 * formatDate();
 * formatDate(1603264465956);
 * formatDate(1603264465956, "h:m:s");
 * formatDate(1603264465956, "Y年M月D日");
 * ```
 */
function formatDate(value = Date.now(), format = "Y-M-D h:m:s") {
    const formatNumber = n => `0${n}`.slice(-2);
    const date = new Date(value);
    const formatList = ["Y", "M", "D", "h", "m", "s"];
    const resultList = [];
    resultList.push(date.getFullYear().toString());
    resultList.push(formatNumber(date.getMonth() + 1));
    resultList.push(formatNumber(date.getDate()));
    resultList.push(formatNumber(date.getHours()));
    resultList.push(formatNumber(date.getMinutes()));
    resultList.push(formatNumber(date.getSeconds()));
    for (let i = 0; i < resultList.length; i++) {
        format = format.replace(formatList[i], resultList[i]);
    }
    return format;
}

方法三

获得当前时间,并格式化

function getNowFormatDate() {
    var date = new Date();
     
    var year = date.getFullYear();
    var month = date.getMonth() + 1;
    var d = date.getDate();
    var hour = date.getHours();
    var minute = date.getMinutes();
    var second = date.getSeconds();
     
    if(month<10){
        month = "0" + month;
    }
     
    if(d<10){
        d = "0" + d;
    }
     
    if(hour<10){
        hour = "0" + hour;
    }
     
    if(minute<10){
        minute = "0" + hour;
    }
     
    if(second<10){
        second = "0" + second;
    }
     
    return year + "-" + month + "-" + d + " " +hour + ":" + minute + ":" + second;
}

注意这里的月要加1。

方法四

方法

// 对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;
}

调用

 $(document).ready(function(){
    //给时间控件加上样式
     $("#tb").find("input[name='cruMon_begin']").attr("class","Wdate").click(function(){WdatePicker({dateFmt:'yyyy-MM'});});
     $("#tb").find("input[name='cruMon_end']").attr("class","Wdate").click(function(){WdatePicker({dateFmt:'yyyy-MM'});});
     $("#tb").find("input[name='cruMon_begin']").attr("value",new Date().Format("yyyy-MM"));
     $("#tb").find("input[name='cruMon_end']").attr("value",new Date().Format("yyyy-MM"));
 });

方法五

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 time = new Date().format("yyyy-MM-dd hh:mm:ss");

到此这篇关于JS格式化时间的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 微信小程序 Animation实现图片旋转动画示例

    微信小程序 Animation实现图片旋转动画示例

    这篇文章主要介绍了微信小程序 Animation实现图片旋转动画示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-08-08
  • 深入解析JavaScript中的变量作用域

    深入解析JavaScript中的变量作用域

    这篇文章主要是对JavaScript中的变量作用域进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 在IE6下发生Internet Explorer cannot open the Internet site错误

    在IE6下发生Internet Explorer cannot open the Internet site错误

    最近在IE6下面时常会发生“Internet Explorer cannot open the Internet site ”错误。
    2010-06-06
  • 浅谈如何优雅处理JavaScript异步错误

    浅谈如何优雅处理JavaScript异步错误

    这篇文章主要介绍了浅谈如何优雅处理JavaScript异步错误,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • 微信小程序实现登录注册界面

    微信小程序实现登录注册界面

    这篇文章主要为大家详细介绍了微信小程序实现登录注册界面,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-08-08
  • zeroclipboard复制到剪切板的flash

    zeroclipboard复制到剪切板的flash

    虽然网上实现Ctrl + C的JS代码已经有很多了,但我还是向大家推荐一个比较好的插件zeroclipboard,兼容所有浏览器
    2010-08-08
  • 在Web关闭页面时发送Ajax请求的实现方法

    在Web关闭页面时发送Ajax请求的实现方法

    这篇文章主要给大家介绍了关于如何在Web关闭页面时发送Ajax请求的实现方法,文中通过示例代码以及图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-03-03
  • Typescript 中的 interface 和 type 到底有什么区别详解

    Typescript 中的 interface 和 type 到底有什么区别详解

    这篇文章主要介绍了Typescript 中的 interface 和 type 到底有什么区别详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-06-06
  • JavaScript闭包详解

    JavaScript闭包详解

    这篇文章主要为大家介绍了JavaScript闭包,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2021-11-11
  • JavaScript中Webpack的使用教程

    JavaScript中Webpack的使用教程

    Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源,这篇文章主要介绍了JavaScript中Webpack的使用,需要的朋友可以参考下
    2021-10-10

最新评论