【问题标题】:Formatting the date time with Javascript使用 Javascript 格式化日期时间
【发布时间】:2012-01-13 07:13:27
【问题描述】:

我有一个日期/时间字符串,例如 2012-01-13 04:37:20,但我想将其转换为 dd-mm-yyyy hh:mm,我该怎么做?

我正在使用以下代码,但它会引发异常。

var now = "2012-01-13 04:37:20";
var dd = now.toLocaleDateString() + " " + now.toLocaleTimeString();
alert(dd);

【问题讨论】:

    标签: javascript html


    【解决方案1】:

    您可以进行简单的字符串操作并创建 js 日期对象。请参阅下面的函数,它接受格式为 //yyyy-mm-dd hh:mm:ss

    的日期

    DEMO这里

    function toJSDate (dateTime) {
    
    var dateTime = dateTime.split(" ");//dateTime[0] = date, dateTime[1] = time
    
    var date = dateTime[0].split("-");
    var time = dateTime[1].split(":");
    
    //(year, month, day, hours, minutes, seconds, milliseconds)
    // mont is 0 indexed so date[1] - 1 corrected format
    return new Date(date[0], date[1]-1, date[2], time[0], time[1], time[2], 0);
        
    }
    

    【讨论】:

    • date[1] 应该是 date[1] - 1 以获得正确的月份输出。
    【解决方案2】:

    JavaSCript 中最好的日期时间处理库是moment.

    moment().format('MMMM Do YYYY, h:mm:ss a');
    

    【讨论】:

      【解决方案3】:

      如果您不需要像Moment.js 这样的库提供的所有功能,那么您可以使用我的strftime 端口。它是轻量级的(与 Moment.js 2.15.0 相比缩小了 1.35 KB 与 57.9 KB),并提供了 strftime() 的大部分功能。

      /* Port of strftime(). Compatibility notes:
       *
       * %c - formatted string is slightly different
       * %D - not implemented (use "%m/%d/%y" or "%d/%m/%y")
       * %e - space is not added
       * %E - not implemented
       * %h - not implemented (use "%b")
       * %k - space is not added
       * %n - not implemented (use "\n")
       * %O - not implemented
       * %r - not implemented (use "%I:%M:%S %p")
       * %R - not implemented (use "%H:%M")
       * %t - not implemented (use "\t")
       * %T - not implemented (use "%H:%M:%S")
       * %U - not implemented
       * %W - not implemented
       * %+ - not implemented
       * %% - not implemented (use "%")
       *
       * strftime() reference:
       * http://man7.org/linux/man-pages/man3/strftime.3.html
       *
       * Day of year (%j) code based on Joe Orost's answer:
       * http://stackoverflow.com/questions/8619879/javascript-calculate-the-day-of-the-year-1-366
       *
       * Week number (%V) code based on Taco van den Broek's prototype:
       * http://techblog.procurios.nl/k/news/view/33796/14863/calculate-iso-8601-week-and-year-in-javascript.html
       */
      function strftime(sFormat, date) {
        if (!(date instanceof Date)) date = new Date();
        var nDay = date.getDay(),
          nDate = date.getDate(),
          nMonth = date.getMonth(),
          nYear = date.getFullYear(),
          nHour = date.getHours(),
          aDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
          aMonths = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
          aDayCount = [0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334],
          isLeapYear = function() {
            return (nYear%4===0 && nYear%100!==0) || nYear%400===0;
          },
          getThursday = function() {
            var target = new Date(date);
            target.setDate(nDate - ((nDay+6)%7) + 3);
            return target;
          },
          zeroPad = function(nNum, nPad) {
            return ('' + (Math.pow(10, nPad) + nNum)).slice(1);
          };
        return sFormat.replace(/%[a-z]/gi, function(sMatch) {
          return {
            '%a': aDays[nDay].slice(0,3),
            '%A': aDays[nDay],
            '%b': aMonths[nMonth].slice(0,3),
            '%B': aMonths[nMonth],
            '%c': date.toUTCString(),
            '%C': Math.floor(nYear/100),
            '%d': zeroPad(nDate, 2),
            '%e': nDate,
            '%F': date.toISOString().slice(0,10),
            '%G': getThursday().getFullYear(),
            '%g': ('' + getThursday().getFullYear()).slice(2),
            '%H': zeroPad(nHour, 2),
            '%I': zeroPad((nHour+11)%12 + 1, 2),
            '%j': zeroPad(aDayCount[nMonth] + nDate + ((nMonth>1 && isLeapYear()) ? 1 : 0), 3),
            '%k': '' + nHour,
            '%l': (nHour+11)%12 + 1,
            '%m': zeroPad(nMonth + 1, 2),
            '%M': zeroPad(date.getMinutes(), 2),
            '%p': (nHour<12) ? 'AM' : 'PM',
            '%P': (nHour<12) ? 'am' : 'pm',
            '%s': Math.round(date.getTime()/1000),
            '%S': zeroPad(date.getSeconds(), 2),
            '%u': nDay || 7,
            '%V': (function() {
                    var target = getThursday(),
                      n1stThu = target.valueOf();
                    target.setMonth(0, 1);
                    var nJan1 = target.getDay();
                    if (nJan1!==4) target.setMonth(0, 1 + ((4-nJan1)+7)%7);
                    return zeroPad(1 + Math.ceil((n1stThu-target)/604800000), 2);
                  })(),
            '%w': '' + nDay,
            '%x': date.toLocaleDateString(),
            '%X': date.toLocaleTimeString(),
            '%y': ('' + nYear).slice(2),
            '%Y': nYear,
            '%z': date.toTimeString().replace(/.+GMT([+-]\d+).+/, '$1'),
            '%Z': date.toTimeString().replace(/.+\((.+?)\)$/, '$1')
          }[sMatch] || sMatch;
        });
      }
      

      示例用法:

      // Returns "15-09-2016 16:20"
      strftime('%d-%m-%Y %H:%M');
      
      // You can optionally pass it a Date object
      // Returns "01-01-2016 21:30"
      strftime('%d-%m-%Y %H:%M', new Date('Jan 1, 2016 9:30 PM'));
      

      最新代码在这里:https://github.com/thdoan/strftime

      【讨论】:

        【解决方案4】:

        使用简单的字符串操作(如@SKS 建议的那样)或使用库。后者更灵活,可让您轻松更改输入或输出格式。例如,使用Globalize.js 库,您可以编写:

        var dd = Globalize.parseDate(now, "yyyy-MM-dd HH:mm:ss");
        dd = Globalize.format(dd, "dd-MM-yyyy HH:mm");
        

        但请注意,诸如“dd-mm-yyyy hh:mm”之类的格式令人困惑——它既不是标准 ISO 格式,也不是任何本地化(与语言相关的)格式。 Globalize.js 库允许您使用预定义的语言相关格式以及明确指定的格式。

        请注意,JavaScript 中内置的日期和时间解析和格式化例程是依赖于实现的。使用它们意味着不可移植的代码。例如,不能保证new Date() 将接受您的输入格式,并且 toLocaleDateString() 以某种与语言环境相关的格式写入日期,该格式几乎可以是任何格式。

        【讨论】:

          【解决方案5】:

          一个小而有效的函数,如下:

          var formatTime = function(time, format){
              time = typeof time == 'number' ? new Date(time) : time;
              format = format || 'yyyy-mm-dd hh:MM:ss';
              var add0 = function(t){ return t < 10 ? '0' + t : t; };
              var year = time.getFullYear();
              var month = time.getMonth() + 1; // 0 indexed
              var date = time.getDate();
              var hours = time.getHours();
              var minutes = time.getMinutes();
              var seconds = time.getSeconds();
              var replaceMent = {
                  'yyyy': year,
                  'mm': add0(month),
                  'm': month,
                  'dd': add0(date),
                  'd': date,
                  'hh': add0(hours),
                  'h': hours,
                  'MM': add0(minutes),
                  'M': minutes,
                  'ss': add0(seconds),
                  's': seconds
              }
              for(var key in replaceMent){
                  format = format.replace(key, replaceMent[key]);
              }
              return format;
          }
          

          示例用法:

          // As Date Input
          formatTime(new Date()); // 2020-12-10 16:29:32
          // As Date Input
          formatTime(new Date(),"yyyy-mm-dd"); // 2020-12-10
          // OR
          formatTime(new Date(),"hh:MM:ss"); // 16:29:32
          // As Time Input
          formatTime(new Date().getTime()); // 2020-12-10 16:29:32
          // OR
          formatTime(1607606809630); // 2020-12-10 16:29:32
          // OR
          formatTime(1607606809630,"yyyy-mm-dd"); // 2020-12-10
          // OR
          formatTime(1607606809630,"hh:MM:ss"); // 16:29:32
          

          【讨论】:

            【解决方案6】:

            我认为最好使用Intl.DateTimeFormat 类。

            用法相当简单。您无法随意输入模式,但它会为您提供所需的结果。

            这是一个如何使用它的示例:

            public formatDate(date : Date) : string{
                var options = {  year: 'numeric', month: 'short', day: 'numeric' };
                return new Intl.DateTimeFormat('de-DE', options).format(date);
            }
            

            如果你真的想输入一个 DateTimeFormat 字符串,编写一个使用 Regex 解析字符串的函数很容易,但我认为不需要。

            欲了解更多信息,请点击此处:

            https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat

            【讨论】:

            • 很高兴知道这存在,但并非在所有平台上都可用,如 Mozilla 参考中所述
            【解决方案7】:

            要在 javascript 中使用 DateTimes,最好使用“Intl.DateTimeFormat”,如下所示:

            var date = new Date('2012-01-13 14:37:20');
            var options = { year: 'numeric', month: '2-digit', day: '2-digit',
            hour:'2-digit', minute: '2-digit',hour12: false};
            console.log(new Intl.DateTimeFormat('en-US', options).format(date).replace(/\//g,'-').replace(',',''));
            

            结果:“01-13-2012 14:37”

            日期和时间格式可以通过 options 参数自定义。

            Check Online

            【讨论】:

              【解决方案8】:

              Love one liners - 本地日期 SPACE 时间 DOT 毫秒/IIFE:

              // simpler, but milliseconds not padded
              console.log(
              (function(d){return d.toLocaleDateString() + ' ' + d.toLocaleTimeString() + '.' + d.getMilliseconds()})(new Date())
              )
              
              // including millis padding
              console.log(
              (function(d){return d.toLocaleDateString() + ' ' + d.toLocaleTimeString() + '.' + (d.getMilliseconds()+1000+'').substr(1)})(new Date())
              )

              【讨论】:

                【解决方案9】:

                Date 需要 Date 对象,所以你应该给 var d = new Date() 这样的东西 那么对于格式,请参阅http://code.google.com/p/datejs/ 链接,它会有所帮助。

                【讨论】:

                  【解决方案10】:

                  通过我的date-shortcode 包轻松完成:

                  const dateShortcode = require('date-shortcode')
                  dateShortcode.parse('{DD-MM-YYYY hh:mm}', '2012-01-13 04:37:20')
                  //=> '13-01-2012 04:37'
                  

                  【讨论】:

                    【解决方案11】:

                    使用 Jquery,您可以像这样窃取 datepicker 的功能:

                    $.datepicker.formatDate( "dd-M-yy", new Date())

                    【讨论】:

                    • 当您不想添加 moment.js 时,这是个好主意,但您已经有了 datepicker 供您使用!
                    【解决方案12】:

                    您的变量现在是一个String 对象,而toLocaleDateString 方法需要一个Date 对象。见w3schools

                    【讨论】:

                      猜你喜欢
                      • 1970-01-01
                      • 1970-01-01
                      • 2017-08-01
                      • 1970-01-01
                      • 2015-10-04
                      • 1970-01-01
                      • 2023-03-08
                      • 1970-01-01
                      • 1970-01-01
                      相关资源
                      最近更新 更多