Html текущая дата и время

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

Указание даты и времени для ивента (например, "концерт Alan Walker в Москве 25 февраля в 19:00") в микроразметке, обозначение точки отсчета для скриптов на странице, улучшенное понимание даты и времени указанного в контенте страницы поисковой системой (например, с помощью тега ) – для этих целей нужно использовать формат времени HTML.

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

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

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

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

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

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

  • YYYY – год, 4 цифры;
  • MM – месяц, 2 цифры;
  • DD – число, 2 цифры;
  • T – разделитель даты и времени, вместо "T" можно использовать пробел;
  • hh – часы, 2 цифры, используется 24-часовой формат времени;
  • mm – минуты, 2 цифры;
  • ss – секунды, 2 цифры;
  • TZD – временная зона, например: "+03:00". Формат временной зоны: +hh:mm, либо -hh:mm.

Также можно указать неделю в году в формате YYYY-WW. WW – номер недели, 2 цифры.

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

Название Формат Пример
Дата, точное время, временная зона YYYY-MM-DDThh:mm:ssTZD 2010-05-12 22:47:11+02:00
Дата и время YYYY-MM-DDThh:mm 2015-09-23 21:13
Время с временной зоной hh:mmTZD 12:34+04:00
Дата YYYY-MM-DD 2015-09-23
Месяц и число MM-DD 01-30
Год и месяц YYYY-MM 1989-11
Год и неделя YYYY-WW 2009-46
Год YYYY 2007
Читайте также:  One touch лаунчер остановлено

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

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

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

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

P – префикс периода;

W – суффикс для количества недель (604800 секунд);

D – суффикс для количества дней (86400 секунд);

T – префикс времени;

H – суффикс для количества часов (3600 секунд);

M – суффикс для количества минут (60 секунд);

S – суффикс для количества секунд;

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

Название Формат Пример
2 недели PхW P2W
10 дней PхD P10D
4 дня 3 часа 5 минут PхDTхHхM P4DT3H5M
2 часа 37 минут PTхHхM PT2H37M
5 минут 10 секунд PTхMхS PT5M10S

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

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

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

За вывод даты и времени в JavaScript отвечает объект типа Date() .

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

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

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

Если мы хотим вывести дату и время в более привычном формате, можем воспользоваться функциями getFullYear() , getMonth() , getDate() , getHours() , getMinutes() , getSeconds() .

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

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

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

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

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

Читайте также:  Что такое сноска в редакторе word

Изменить формат даты и времени, выводимый в HTML код страницы, вы можете, комбинируя функции объекта Date() . Все они описаны в справочнике по JavaScript.

Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

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

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

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

Реализация на странице сайта

Создайте новый текстовой документ и дайте ему название, например, date.js . Скопируйте код скрипта из таблицы и вставьте в документ date.js :

Файл date.js закачайте на сервер сайта в папку со скриптами, обычно она так и называется – js .

В месте вывода показа времени и даты расположите этот код:

Путь к файлу скрипта.

В месте вставки последнего кода будет отражаться показ системного времени и даты.

Если у Вас сайт на PHP, вопрос решается гораздо проще. Вот простой пример кода для вывода даты и времени:

Выше представленный код копируйте и вставляйте на страницу сайта на PHP в то место, где планируете вывод даты и времени. Результат выглядит так:

Сегодня 20.11.19. Текущее время 10:16

Капля полезной информации

Чтобы в подвале сайта на PHP в строке Copyright, например, © 2010–2019 site.ru всегда был актуальным текущий год, вместо набора цифр 2019 вставьте следующий код:

Читайте также:  Gigabyte ga z170n wifi

и в дальнейшем навсегда избавите себя от ручной корректировки.

Вот вся информация по этой теме. Применяйте скрипт на своём сайте и всего Вам самого доброго! Ваш Л.М.

Для того, чтобы посетители и пользователи Вашего сайта могли наблюдать текущую дату и время, воспользуйтесь нашим простым JavaScript кодом, приведенным чуть ниже. Для этого необходимо сначала на JavaScript описать в начале Вашей странички функцию генерирования текущего времени и даты clock() следующим образом:

script type = "text/javascript" >
function clock () <
var d = new Date ();
var month_num = d . getMonth ()
var day = d . getDate ();
var hours = d . getHours ();
var minutes = d . getMinutes ();
var seconds = d . getSeconds ();

month =new Array( "января" , "февраля" , "марта" , "апреля" , "мая" , "июня" ,
"июля" , "августа" , "сентября" , "октября" , "ноября" , "декабря" );

if ( day 9 ) day = "0" + day ;
if ( hours 9 ) hours = "0" + hours ;
if ( minutes 9 ) minutes = "0" + minutes ;
if ( seconds 9 ) seconds = "0" + seconds ;

date_time = "Сегодня – " + day + " " + month [ month_num ] + " " + d . getFullYear () +
" г. Текущее время – " + hours + ":" + minutes + ":" + seconds ;
if ( document . layers ) <
document . layers . doc_time . document . write ( date_time );
document . layers . doc_time . document . close ();
>
else document . getElementById ( "doc_time" ). innerHTML = date_time ;
setTimeout ( "clock()" , 1000 );
>

Далее в заданном месте Вашей странички (там, где будет выводиться дата и время) необходимо добавить следующий HTML код:

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

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

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock detector