На сайтах для международной аудитории нередко возникает желание, а может даже и необходимость, показывать заранее известные дату и время в часовом любого зашедшего на сайт пользователя. Например, чтобы сообщить дату и время начала распродажи, или дату окончания торгов на аукционе, или дату сообщения на форуме.

Традиционно это требовало регистрации на сайте и указания временной зоны в настройках, но есть способ проще.

Сначала HTML

В требуемых местах указываем дату и время в атрибуте data-date, например, так:

<abbr class="localtime" data-date="Fri, 29 Jun 2012 12:00:00 -1200"></abbr>

Этот атрибут data-date должен содержать дату в формате RFC 2822 в любом часовом поясе. Использование именно такого формата даты и времени связано с историческими ограничениями метода Date.parse().

Потом JavaScript

В функцию, вызываемую в $(document).ready(), добавляем код, который заменяет содержимое указанного выше тега <abbr> датой и временем в часовом поясе пользователя:

$('.localtime').each(function() {
    var $this = $(this);
    // получим дату из строкового представления
    var date = new Date($this.data('date'));
    // можно показывать и только время; см. функции
    // date.toLocaleDateString() и date.toLocaleTimeString()
    $this.html(date.toLocaleString());
    $this.attr('title', $this.data('date'));
});

Перезагружаем страницу и видим время не в UTC−12, как в исходном атрибуте data-date, а в вашем часовом поясе.

Например, так, как под заголовком этой статьи. Или так, как ниже: