Форматирование текущего времени с помощью Javascript


Я хочу получить текущее время в определенном формате с javascript.

С помощью функции ниже и вызов ее даст мне Пт фев 01 2013 13: 56: 40 GMT+1300 (новозеландское летнее время) но я хочу отформатировать его так Пятница 2:00 вечера 1 февраля 2013

var d = new Date();
var x = document.getElementById("time");
x.innerHTML = d;

конечно, код выше не имеет никакой логики форматирования, но я еще не сталкивался с какими-либо "рабочими" форматерами.

10 65

10 ответов:

дата JavaScript имеет несколько методов, позволяющих извлечь его части:

getFullYear() - возвращает 4-значный год
getMonth() - возвращает целое число на основе нуля (0-11), представляющее месяц года.
getDate() - возвращает день месяца (1-31).
getDay() - возвращает день недели (0-6). 0-воскресенье, 6-суббота.
getHours() - возвращает время суток (0-23).
getMinutes() - возвращает минуты (0-59).
getSeconds() - возвращает второй (0-59).
getMilliseconds() - возвращает миллисекунды (0-999).
getTimezoneOffset() - возвращает количество минут между локальным временем машины и UTC.

нет встроенных методов, позволяющих получить локализованные строки, такие как" пятница"," февраль "или"PM". Вы должны сами это закодировать. Чтобы получить нужную строку, вам, по крайней мере, нужно сохранить строковые представления дней и месяцев:

var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

затем соберите его вместе с помощью методов выше:

var d = new Date();
var day = days[d.getDay()];
var hr = d.getHours();
var min = d.getMinutes();
if (min < 10) {
    min = "0" + min;
}
var ampm = "am";
if( hr > 12 ) {
    hr -= 12;
    ampm = "pm";
}
var date = d.getDate();
var month = months[d.getMonth()];
var year = d.getFullYear();
var x = document.getElementById("time");
x.innerHTML = day + " " + hr + ":" + min + ampm + " " + date + " " + month + " " + year;

у меня есть функция формата даты, которую я хотел бы включить в свою стандартную библиотеку. Он принимает параметр строки формата, который определяет желаемый результат. Формат строки свободно на основе.Net пользовательских строк формата даты и времени. Для указанного формата будет работать следующая строка формата:"dddd h:mmtt d MMM yyyy".

var d = new Date();
var x = document.getElementById("time");
x.innerHTML = formatDate(d, "dddd h:mmtt d MMM yyyy");

Demo:jsfiddle.net/BNkkB/1

здесь моя полная функция форматирования даты:

function formatDate(date, format, utc) {
    var MMMM = ["\x00", "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var MMM = ["\x01", "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
    var dddd = ["\x02", "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
    var ddd = ["\x03", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];

    function ii(i, len) {
        var s = i + "";
        len = len || 2;
        while (s.length < len) s = "0" + s;
        return s;
    }

    var y = utc ? date.getUTCFullYear() : date.getFullYear();
    format = format.replace(/(^|[^\])yyyy+/g, "" + y);
    format = format.replace(/(^|[^\])yy/g, "" + y.toString().substr(2, 2));
    format = format.replace(/(^|[^\])y/g, "" + y);

    var M = (utc ? date.getUTCMonth() : date.getMonth()) + 1;
    format = format.replace(/(^|[^\])MMMM+/g, "" + MMMM[0]);
    format = format.replace(/(^|[^\])MMM/g, "" + MMM[0]);
    format = format.replace(/(^|[^\])MM/g, "" + ii(M));
    format = format.replace(/(^|[^\])M/g, "" + M);

    var d = utc ? date.getUTCDate() : date.getDate();
    format = format.replace(/(^|[^\])dddd+/g, "" + dddd[0]);
    format = format.replace(/(^|[^\])ddd/g, "" + ddd[0]);
    format = format.replace(/(^|[^\])dd/g, "" + ii(d));
    format = format.replace(/(^|[^\])d/g, "" + d);

    var H = utc ? date.getUTCHours() : date.getHours();
    format = format.replace(/(^|[^\])HH+/g, "" + ii(H));
    format = format.replace(/(^|[^\])H/g, "" + H);

    var h = H > 12 ? H - 12 : H == 0 ? 12 : H;
    format = format.replace(/(^|[^\])hh+/g, "" + ii(h));
    format = format.replace(/(^|[^\])h/g, "" + h);

    var m = utc ? date.getUTCMinutes() : date.getMinutes();
    format = format.replace(/(^|[^\])mm+/g, "" + ii(m));
    format = format.replace(/(^|[^\])m/g, "" + m);

    var s = utc ? date.getUTCSeconds() : date.getSeconds();
    format = format.replace(/(^|[^\])ss+/g, "" + ii(s));
    format = format.replace(/(^|[^\])s/g, "" + s);

    var f = utc ? date.getUTCMilliseconds() : date.getMilliseconds();
    format = format.replace(/(^|[^\])fff+/g, "" + ii(f, 3));
    f = Math.round(f / 10);
    format = format.replace(/(^|[^\])ff/g, "" + ii(f));
    f = Math.round(f / 10);
    format = format.replace(/(^|[^\])f/g, "" + f);

    var T = H < 12 ? "AM" : "PM";
    format = format.replace(/(^|[^\])TT+/g, "" + T);
    format = format.replace(/(^|[^\])T/g, "" + T.charAt(0));

    var t = T.toLowerCase();
    format = format.replace(/(^|[^\])tt+/g, "" + t);
    format = format.replace(/(^|[^\])t/g, "" + t.charAt(0));

    var tz = -date.getTimezoneOffset();
    var K = utc || !tz ? "Z" : tz > 0 ? "+" : "-";
    if (!utc) {
        tz = Math.abs(tz);
        var tzHrs = Math.floor(tz / 60);
        var tzMin = tz % 60;
        K += ii(tzHrs) + ":" + ii(tzMin);
    }
    format = format.replace(/(^|[^\])K/g, "" + K);

    var day = (utc ? date.getUTCDay() : date.getDay()) + 1;
    format = format.replace(new RegExp(dddd[0], "g"), dddd[day]);
    format = format.replace(new RegExp(ddd[0], "g"), ddd[day]);

    format = format.replace(new RegExp(MMMM[0], "g"), MMMM[M]);
    format = format.replace(new RegExp(MMM[0], "g"), MMM[M]);

    format = format.replace(/\(.)/g, "");

    return format;
};

вы можете попробовать

var d = new Date();
d.toLocaleString();       // -> "2/1/2013 7:37:08 AM"
d.toLocaleDateString();   // -> "2/1/2013"
d.toLocaleTimeString();  // -> "7:38:05 AM"

документация

Вы можете использовать мой порт 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() {
      if ((nYear&3)!==0) return false;
      return 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+).+/, ''),
      '%Z': date.toTimeString().replace(/.+\((.+?)\)$/, '')
    }[sMatch] || sMatch;
  });
}

пример использования:

// Returns "Thursday 4:45pm 15 Sep 2016"
strftime('%A %l:%M%P %e %b %Y');

// You can optionally pass it a Date object
// Returns "Friday 2:00pm 1 Feb 2013"
strftime('%A %l:%M%P %e %b %Y', new Date('Feb 1, 2013 2:00 PM'));

последний код доступен здесь:https://github.com/thdoan/strftime

для времени я в основном использую toLocaleDateString и toLocaleTimeString для форматирования даты и времени. Первый параметр, передаваемый этим методам, является значением локали, например en-us. Второй параметр, если он присутствует, указывает параметры форматирования, такие как длинная форма для дня недели.

let date = new Date();  
let options = {  
    weekday: "long", year: "numeric", month: "short",  
    day: "numeric", hour: "2-digit", minute: "2-digit"  
};  

console.log(date.toLocaleTimeString("en-us", options)); 

выход: среда, 25 октября 2017, 8:19 PM

пожалуйста, см. ниже ссылку новые подробности.

строки даты и времени (JavaScript)

смотреть на внутренности класса Date и вы увидите, что вы можете извлечь все биты (дата, месяц, год, час и т. д.).

http://www.w3schools.com/jsref/jsref_obj_date.asp

для чего-то вроде Friday 2:00pm 1 Feb 2013 код вроде:

var dateString = date.getDay() + " " + date.getHours() + ":" + date.getMinutes() ...

есть много библиотек там, для тех, кто заинтересован

там действительно не должно быть необходимости в эти дни, чтобы изобрести свои собственные спецификаторы форматирования.

2.39 КБ сокращен. Один файл. https://github.com/rhroyston/clock-js

текущее время

var str = clock.month;
var m = str.charAt(0).toUpperCase() + str.slice(1,3); //gets you abbreviated month
clock.weekday + ' ' + clock.time + ' ' + clock.day + ' ' + m + ' ' + clock.year; //"tuesday 5:50 PM 3 May 2016"

d = Date.now();
d = new Date(d);
d = (d.getMonth()+1)+'/'+d.getDate()+'/'+d.getFullYear()+' '+(d.getHours() > 12 ? d.getHours() - 12 : d.getHours())+':'+d.getMinutes()+' '+(d.getHours() >= 12 ? "PM" : "AM");

console.log(d);

для работы с базовым классом даты вы можете посмотреть на MDN для его методов (вместо W3Schools из-за этой причине). Там вы можете найти хорошее описание каждого метода, полезного для доступа к каждому отдельному компоненту даты/времени и информации относительно того, является ли метод устаревшим или нет.

в противном случае вы можете посмотреть момент.js это хорошая библиотека для использования для обработки даты и времени. Вы можете использовать его для управления датой и время (например, разбор, форматирование, i18n и т. д.).

function startTime() {
    var today = new Date(),
        h = checkTime(((today.getHours() + 11) % 12 + 1)),
        m = checkTime(today.getMinutes()),
        s = checkTime(today.getSeconds());
    document.getElementById('demo').innerHTML = h + ":" + m + ":" + s;
    t = setTimeout(function () {
        startTime()
    }, 500);
}
startTime();

})();

05:12:00