5 элементов HTML, которые вы, возможно, не знаете, как использовать

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

В сегодняшнем посте мы рассмотрим пять элементов HTML, некоторые из которых вы можете часто использовать, но вероятно, не в полном объеме.

1.

элемент имеет функцию, аналогичную данные-* атрибуты. Это может быть использовано для предоставить машиночитаемые данные для удобного контента. значение атрибут этого элемента несет добавленную информацию.

 
Три тома романа «Властелин колец»: Братство кольца, Две башни, а также Возвращение короля.
 
ISBN книг, упомянутых на этой странице: 
 

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

 const ISBNListBlank = document.querySelector ('# ISBNListBlank') const dataElements = document.querySelectorAll ('data'); const ary = []; dataElements.forEach ((dataElement) => ary.push (dataElement.textContent + ':' + dataElement.value)) ISBNListBlank.textContent = ary.join (',') 

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

2.

Скорее всего, вы уже знакомы с элемент, однако это не только для флажков. Оно может контролировать другие labellable элементы а также, выполняя свои действия так же, как он выполняет действия флажков.

Вам нужно только использовать то же значение для Я бы атрибут HTML-элемента, который вы хотите контролировать, и за атрибут принадлежности тег.

  При нажатии на этот текст нажимает кнопку ниже.   ALERT  

Нажав на текст будут вызвать щелчок событие и показать данное предупреждение.

3.

Этот элемент в основном используется для восточноазиатских языков, Однако это не”Это единственный вариант использования. Цель это просто добавить аннотацию или произношение для текстов, и вы можете сделать это и с английским контентом.

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

 
Человек, который создает бизнес или бизнес, берет на себя финансовые риски в надежде на прибыль, называется предпринимательà ??  ?? à ?? Â'ntrà ??  ?? PRA ??  ?? à ??  ?? nà ??  ?? à ??  ??; промоутер в индустрии развлечений.
 

Произношение “предприниматель” слово добавлено с использованием элемент внутри абзаца. Само слово обернуто в тег и произношение в .

Вот как выглядит результат:

4.

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

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

, с использованием обратная атрибут.

 
 
рыться
 
Маджонг
 
монопольный
 
шахматы
 
Jenga
 
 

обратная атрибут меняет нумерацию, в то время как тип атрибут определяет тип нумерации. Столица I обозначает прописную римскую нумерацию.

Вот как это выглядит на экране:



5.

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

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

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

 
Есть  дихотомия  между дизайном и прототипом.
 

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



Если навести курсор на определенное слово, страница показать определение, добавленное в заглавие атрибут.