Times html что это
Тег HTML время, период времени, дата
Тег HTML используется для обозначения текста как временной точки (времени, либо даты и времени) или временного периода.
Внутри тега time время указывается в человеко-понятном формате. Атрибут datetime тега содержит дату и время в машиночитаемом формате.
Тег может содержать как точную дату и время (временную точку), например, «среда 18:30», так и промежуток (период, отрезок) времени, например, «2 дня 3 часа».
Формат текста тега свободный, однако, в атрибуте datetime нужно придерживаться четкого стандарта.
Подробно о формате HTML даты и времени с примерами читайте в статье: Дата и время в HTML. Формат, текущее время, часы на сайте.
Этот тег был введен в HTML5.
Синтаксис
Отображение в браузере
Примеры использования в HTML коде
Поддержка браузерами
Тег | |||||
Да | Да | Да | Да | Да |
Атрибуты тега
Дата и время в машиночитаемом формате.
Вы можете указывать дату / время с необходимой вам точностью (например, только год или только день и месяц).
Элемент HTML <time>
Элемент <time> представляет собой дату, время или период времени, представленные в машинночитаемом формате. Он может быть полезен для создания расписаний, архивов или других функций, связанных со временем. WordPress использует этот элемент в базовой теме оформления. Ещё один пример использования <time> — Reddit:
Краткая история
Жизненный путь этого элемента был нелёгким. Его добавили в спецификацию HTML5 в 2009 году. Два года спустя, в 2011, его убрали и заменили на гораздо более широкий <data>. Однако в этом же году его вернули и добавили новых возможностей. Сейчас его можно уверенно использовать.
Ситуацию хорошо описал Брюс Лоусон (убрали, вернули, текущее положение дел). [Та же история на Хабре: убрали, вернули]. Классический пример того, как реакция сообщества разработчиков влияет на развитие HTML.
Тэг и атрибут
<time> можно использовать как обычный тег HTML. Вот простой пример, который представляет ноябрь 2011:
В этом примере текст внутри тега является валидным значением атрибута datetime (о котором подробнее пойдёт речь дальше). Однако это совершенно необязательно. Это значение можно переместить в атрибут, указанный явно, а внутри тега использовать произвольный текст:
Именно атрибут datetime придаёт этому элементу его уникальные свойства. Он представляет в машинночитаемом виде любую дату, вермя или интервал, относящийся к тексту внутри тега. Так как он предназначен для компьютеров, его формат жестко определён.
В большинстве случаев текст, заключенный в тег, представляет то же самое время в удобочитаемом виде:
10 способов указания времени
Год и месяц
Очень просто: год идёт перед месяцем.
Год, затем месяц, затем день.
Дата без года
Только время
Часы, минуты, секунды. Секунды указывать необязательно. Доли секунды указываются с точностью до третьего знака.
Дата и время
Комбинация даты и времени, разделённых заглавной «T». Букву «T» можно заменить на пробел.
Часовой пояс
Начинается с плюса или минуса. Двоеточие необязательно. Всемирное координированное время (UTC, +00:00) можно заменить заглавной «Z».
Местная дата и время
Дата и время с указанием часового пояса, вместо «T» можно использовать пробел.
Год и неделя
Год, затем заглавная «W» и номер недели.
Только год
Временной интервал (первый способ)
«P», затем опционально — количество дней, «T», затем опционально — количество часов, минут и секунд. Все буквы только в верхнем регистре.
Временной интервал (второй способ)
Недели, дни, минуты, секунды. Буквы могут быть в любом регистре, пробелы необязательны.
Примеры
Проблемы с форматирование datetime?
Эта небольшая форма на CodePen поможет преобразовать значения даты и времени в корректный тег <time> :
Поддержка в брузерах
В чём преимущества использования <time>?
Здесь я процитирую Брюса Лоусона, так как, пожалуй, лучше и не скажешь:
Варианты использования однозначного указания даты придумать нетрудно. Браузер может предложить пользователю добавить событие на странице в его календарь. Браузер в Таиланде может автоматически преобразовать дату в григорианском календаре в традиционный буддийский. Японский браузер может показать <time>16:00</time> как «16:00時». Агрегаторы контента могут автоматически генерировать временную шкалу событий.
Поисковики могут улучшать результаты выдачи. Например, недавно был сильный снегопад, я погуглил и обнаружил, что школа, в которую ходят мои дети, сегодня закрыта. Только когда из школы позвонили и спросили, почему мои дети не пришли, я обнаружил, что внизу страницы с новостью о закрытии школы написано мелким шрифтом: «Опубликовано 5 января 2008». Поисковики вполне могли бы располагать недавние события выше в выдаче.
Ещё одна полезная мелочь
А вот пример кода для Rails, который выводит время в этих трёх видах:
HTML-теги и атрибуты, о которых вы, возможно, не знали
Эта статья — шпаргалка по HTML-тегам. Поэтому не будем разглагольствовать, сразу к делу.
address
Тег address определяет контактную информацию об авторе или владельце документа или статьи. Контактная информацию может включать в себя адрес электронной почты, адрес сайта, физический адрес, номер телефона, ссылки на аккаунты в социальных сетях и т.д.
audio
Тег audio используется для встраивания аудио-контента (музыка и др.) в веб-страницу.
video
Тег video используется для встраивания видео-контента (видеоклип и др.) в веб-страницу.
Тег base определяет основной путь ( URL ) и/или цель ( target ) для всех относительных путей в документе. Он должен размещаться в теге head и иметь хотя бы один из следующих атрибутов:
blockquote и cite
Тег cite определяет название какой-либо работы (книги, стихотворения, песни, фильма, картины, скульптуры и т.д.). Он также может представлять из себя ссылку на источник цитаты.
Тег code используется для определения части компьютерного кода:
Для форматирования блока кода code часто используется совместно с тегом pre :
datalist
Тег datalist определяет список возможных вариантов для заполнения поля для ввода текста. Он позволяет реализовать «автозавершение» для элемента input : при установке фокуса на такое поле пользователь видит выпадающий список.
Свойство options объекта Datalist возвращает коллекцию всех элементов списка.
Внутри dd могут размещаться параграфы, изображения, ссылки, списки и т.д.
details
По умолчанию details находится в закрытом состоянии.
Внутри details могут размещаться любые теги.
Индикатором открытого состояния details является атрибут open (этот атрибут может использоваться в качестве CSS-селектора — details[open] или JavaScript-селектора — document.querySelector(‘[open]’) ).
dialog
Тег dialog определяет диалоговое окно. Он используется для создания «попапов» и модальных окон.
По умолчанию dialog находится в неактивном состоянии.
figure
Тег figure определяет обособленный (автономный) контент, такой как иллюстрации, диаграммы, фотографии, примеры кода и т.д.
Несмотря на то, что контент элемента figure формально относится к основному потоку (main flow), его позиция (местонахождение) не зависит от этого потока. Поэтому удаление элемента figure не должно влиять на поток документа.
meter
Тег meter определяет скалярное значение в пределах известного диапазона или дробного значения. Другими словами, meter определяет меру чего-либо (gauge).
Этот тег не должен использоваться в качестве индикатора прогресса.
Так можно записать уровень заряда батареи вашего устройства в значение meter :
progress
Тег progress определяет процесс выполнения задачи.
Этот тег не должен использоваться для определения меры чего-либо.
Так можно реализовать десятисекундный таймер:
output
Тег output используется для представления результата вычислений.
picture
Тег picture предоставляет возможность использования нескольких источников для изображения (нескольких изображений).
Этот тег позволяет использовать разные изображения в зависимости от ширины области просмотра (viewport width) вместо масштабирования одного изображения.
template
Тег template используется в качестве контейнера для разметки, которая не отображается при загрузке страницы.
Этот тег предназначен для хранения разметки, которая используется часто, но в определенных случаях (по запросу).
Тег time определяет конкретное время (или дату и время).
Атрибут datetime используется для представления времени в машиночитаемом формате.
noscript
Другие теги в форме шпаргалок
Семантическое «секционирование» страницы
Стилизация текста
Форма
Поля для ввода данных
Пример валидации адреса электронной почты и пароля:
Таблица
Теги colgroup и col могут использоваться для стилизации определенных колонок таблицы целиком вместо стилизации каждой ячейки и строки по отдельности.
Послесловие
Наши виртуалки можно использовать для разработки веб-сайтов.
Зарегистрируйтесь по ссылке выше или кликнув на баннер и получите 10% скидку на первый месяц аренды сервера любой конфигурации!
Using «×» word in html changes to ×
I am using the following code.
I am getting × in alert. I need to get × as result.
Anybody knows or faces this problem? Please update your suggestions.
5 Answers 5
You need to escape the ampersand:
You need to escape:
And then read the value using text() to get the unescaped value:
I suspect you did not know that there are different & escapes in HTML. The W3C you can see the codes. × means × in HTML code. Use × instead.
× stands for × in html. Use × to get ×
Use the × code instead of × Because JSF don’t understand the × code.
This link provides some additional information about the topic.
Not the answer you’re looking for? Browse other questions tagged javascript jquery html or ask your own question.
Linked
Related
site design / logo © 2021 Stack Exchange Inc; user contributions licensed under cc by-sa. rev 2021.12.9.40950
By clicking “Accept all cookies”, you agree Stack Exchange can store cookies on your device and disclose information in accordance with our Cookie Policy.
Дата и время в HTML. Формат, текущее время, часы на сайте
При работе с датой и временем на сайте есть необходимость в том, чтобы суть содержимого понимали как пользователи сайта, так и роботы (поисковые системы, скрипты и т.п).
Для человека будет достаточно написать «сегодня в 10», «через 3 дня», в «прошлом году», но для «машины» такая запись далеко не всегда будет информативной. Формат даты и времени в HTML позволяет описывать выражения подобные этим, а также указывать не только временные точки, но и временные отрезки, например «длительность 2 часа 17 минут».
Рассмотрим как правильно писать дату и время в HTML.
Формат точной даты и времени YYYY-MM-DDThh:mm:ssTZD
Этот формат используется для указания конкретной временной точки («20-го апреля», «сегодня в 8 утра», «15 января 2001 года»).
В зависимости от потребностей вы можете использовать как все составляющие, так и какую-то их часть.
Расшифровка формата YYYY-MM-DDThh:mm:ssTZD:
Рассмотрим примеры вывода даты и времени в формате временной точки.
Название | Формат | Пример |
---|---|---|
Дата, точное время, временная зона | 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 |
Формат периода времени (длительность)
Формат PWDTHMS используется когда нужно указать не конкретную точку, а период времени: «3 дня», «2 часа 5 минут» и т.п. То есть, когда нужно показать длительность.
Длительность периода считается в секундах. Если указана другая величина, время приводится к секундам путем умножения:
2 минуты = 2*60 = 120 секунд и т.п.
Расшифровка формата PWDTHMS:
Примеры указания периода времени:
Название | Формат | Пример |
---|---|---|
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.
Попробуем вывести текущую дату и время на экран с помощью встроенного скрипта:
Как видим, выводится вся информация о дате и времени.
Дата и время в HTML в привычном формате
Поскольку функции возвращают значения месяцев, дней, часов, минут, секунд без ведущих нулей, нам понадобится написать дополнительную функцию, которая будет эти нули добавлять.
Также обратите внимание на то, что функция getMonth() возвращает значение от 0 до 11 (количество полных месяцев, прошедших от начала года до указанной даты), а не порядковый номер месяца от 1 до 12. Поэтому, чтобы получить календарный номер месяца нужно к результату функции прибавить единицу.
Вставить текущее время и дату в HTML в привычном формате можно с помощью следующего кода:
Таким образом у нас получилось вывести на страницу сайта точное время на момент открытия страницы.
Часы на сайт, обновляемые в реальном времени
Если мы хотим, чтобы пользователь всегда видел актуальное время, то есть хотим сделать часы на странице, нужно реализовать обновление времени один раз в секунду (либо в минуту, если вы не выводите секунды). Для этого воспользуемся интервалом в JavaScript.