для каких целей предназначен тег time

Тег HTML время, период времени, дата

Тег HTML используется для обозначения текста как временной точки (времени, либо даты и времени) или временного периода.

Внутри тега time время указывается в человеко-понятном формате. Атрибут datetime тега содержит дату и время в машиночитаемом формате.

Тег может содержать как точную дату и время (временную точку), например, «среда 18:30», так и промежуток (период, отрезок) времени, например, «2 дня 3 часа».

Формат текста тега свободный, однако, в атрибуте datetime нужно придерживаться четкого стандарта.

Подробно о формате HTML даты и времени с примерами читайте в статье: Дата и время в HTML. Формат, текущее время, часы на сайте.

Этот тег был введен в HTML5.

Синтаксис

Отображение в браузере

Примеры использования в HTML коде

Поддержка браузерами

Атрибуты тега

Дата и время в машиночитаемом формате.

Вы можете указывать дату / время с необходимой вам точностью (например, только год или только день и месяц).

Источник

Дата и время в HTML. Формат, текущее время, часы на сайте

При работе с датой и временем на сайте есть необходимость в том, чтобы суть содержимого понимали как пользователи сайта, так и роботы (поисковые системы, скрипты и т.п).

Для человека будет достаточно написать «сегодня в 10», «через 3 дня», в «прошлом году», но для «машины» такая запись далеко не всегда будет информативной. Формат даты и времени в HTML позволяет описывать выражения подобные этим, а также указывать не только временные точки, но и временные отрезки, например «длительность 2 часа 17 минут».

Рассмотрим как правильно писать дату и время в HTML.

Формат точной даты и времени YYYY-MM-DDThh:mm:ssTZD

Этот формат используется для указания конкретной временной точки («20-го апреля», «сегодня в 8 утра», «15 января 2001 года»).

В зависимости от потребностей вы можете использовать как все составляющие, так и какую-то их часть.

Расшифровка формата YYYY-MM-DDThh:mm:ssTZD:

Рассмотрим примеры вывода даты и времени в формате временной точки.

Формат периода времени (длительность)

Формат PWDTHMS используется когда нужно указать не конкретную точку, а период времени: «3 дня», «2 часа 5 минут» и т.п. То есть, когда нужно показать длительность.

Длительность периода считается в секундах. Если указана другая величина, время приводится к секундам путем умножения:
2 минуты = 2*60 = 120 секунд и т.п.

Расшифровка формата PWDTHMS:

Примеры указания периода времени:

Как вставить текущее время в HTML

Вывести на страницу сайта текущее время используя только лишь HTML не получится.

Для того, чтобы вставить текущую дату и время на сайт будем использовать JavaScript.

Попробуем вывести текущую дату и время на экран с помощью встроенного скрипта:

Как видим, выводится вся информация о дате и времени.

Дата и время в HTML в привычном формате

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

Также обратите внимание на то, что функция getMonth() возвращает значение от 0 до 11 (количество полных месяцев, прошедших от начала года до указанной даты), а не порядковый номер месяца от 1 до 12. Поэтому, чтобы получить календарный номер месяца нужно к результату функции прибавить единицу.

Вставить текущее время и дату в HTML в привычном формате можно с помощью следующего кода:

Таким образом у нас получилось вывести на страницу сайта точное время на момент открытия страницы.

Часы на сайт, обновляемые в реальном времени

Если мы хотим, чтобы пользователь всегда видел актуальное время, то есть хотим сделать часы на странице, нужно реализовать обновление времени один раз в секунду (либо в минуту, если вы не выводите секунды). Для этого воспользуемся интервалом в JavaScript.

Источник

Элемент HTML &lttime>

Элемент &lttime&gt представляет собой дату, время или период времени, представленные в машинночитаемом формате. Он может быть полезен для создания расписаний, архивов или других функций, связанных со временем. WordPress использует этот элемент в базовой теме оформления. Ещё один пример использования &lttime&gt — Reddit:

Краткая история

Жизненный путь этого элемента был нелёгким. Его добавили в спецификацию HTML5 в 2009 году. Два года спустя, в 2011, его убрали и заменили на гораздо более широкий &ltdata&gt. Однако в этом же году его вернули и добавили новых возможностей. Сейчас его можно уверенно использовать.

Ситуацию хорошо описал Брюс Лоусон (убрали, вернули, текущее положение дел). [Та же история на Хабре: убрали, вернули]. Классический пример того, как реакция сообщества разработчиков влияет на развитие HTML.

Тэг и атрибут

&lttime&gt можно использовать как обычный тег HTML. Вот простой пример, который представляет ноябрь 2011:

В этом примере текст внутри тега является валидным значением атрибута datetime (о котором подробнее пойдёт речь дальше). Однако это совершенно необязательно. Это значение можно переместить в атрибут, указанный явно, а внутри тега использовать произвольный текст:

Именно атрибут datetime придаёт этому элементу его уникальные свойства. Он представляет в машинночитаемом виде любую дату, вермя или интервал, относящийся к тексту внутри тега. Так как он предназначен для компьютеров, его формат жестко определён.

В большинстве случаев текст, заключенный в тег, представляет то же самое время в удобочитаемом виде:

10 способов указания времени

Год и месяц

Очень просто: год идёт перед месяцем.

Год, затем месяц, затем день.

Дата без года

Только время

Часы, минуты, секунды. Секунды указывать необязательно. Доли секунды указываются с точностью до третьего знака.

Дата и время

Комбинация даты и времени, разделённых заглавной «T». Букву «T» можно заменить на пробел.

Часовой пояс

Начинается с плюса или минуса. Двоеточие необязательно. Всемирное координированное время (UTC, +00:00) можно заменить заглавной «Z».

Местная дата и время

Дата и время с указанием часового пояса, вместо «T» можно использовать пробел.

Год и неделя

Год, затем заглавная «W» и номер недели.

Только год

Временной интервал (первый способ)

«P», затем опционально — количество дней, «T», затем опционально — количество часов, минут и секунд. Все буквы только в верхнем регистре.

Временной интервал (второй способ)

Недели, дни, минуты, секунды. Буквы могут быть в любом регистре, пробелы необязательны.

Примеры

Проблемы с форматирование datetime?

Эта небольшая форма на CodePen поможет преобразовать значения даты и времени в корректный тег &lttime&gt :

Поддержка в брузерах

В чём преимущества использования &lttime&gt?

Здесь я процитирую Брюса Лоусона, так как, пожалуй, лучше и не скажешь:

Варианты использования однозначного указания даты придумать нетрудно. Браузер может предложить пользователю добавить событие на странице в его календарь. Браузер в Таиланде может автоматически преобразовать дату в григорианском календаре в традиционный буддийский. Японский браузер может показать &lttime&gt16:00&lt/time&gt как «16:00時». Агрегаторы контента могут автоматически генерировать временную шкалу событий.

Поисковики могут улучшать результаты выдачи. Например, недавно был сильный снегопад, я погуглил и обнаружил, что школа, в которую ходят мои дети, сегодня закрыта. Только когда из школы позвонили и спросили, почему мои дети не пришли, я обнаружил, что внизу страницы с новостью о закрытии школы написано мелким шрифтом: «Опубликовано 5 января 2008». Поисковики вполне могли бы располагать недавние события выше в выдаче.

Ещё одна полезная мелочь

А вот пример кода для Rails, который выводит время в этих трёх видах:

Источник