Что такое атрибут в HTML, какие бывают глобальные атрибуты

11.08.18 ИТ / HTML 6707

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

Глобальные атрибуты в HTML – это атрибуты, которые можно применять почти ко всем элементам:

• accesskey – предоставляет подсказку для создания комбинации клавиш для элемента;
• class – позволяет указать класс или классы для элемента, которые можно потом использовать в CSS и JavaScript;
• contenteditable – позволяет сделать содержимое элемента редактируемым;
• contextmenu – здесь следует указать id тега menu, который используется в качестве контекстного меню для данного элемента;
• data-* - определяет группу атрибутов, которые называются атрибутами пользовательских данных;
• dir - атрибут, который указывает направление текста в элементе. Возможные значения: ltr, rtl, auto;
• draggable - атрибут, который указывает, можно ли перетаскивать элемент мышкой или прочим устройство ввода;
• dropzone - атрибут, указывающий типы содержимого, которое можно перетащить в элемент. Возможные значения: copy, move, link;
• hidden – позволяет скрыть элемент;
• id – задет идентификатор для элемента;
• item* - ряд атрибутов, которые можно использовать для определения микроданных: itemid, itemprop, itemref, itemscope, itemtype;
• lang – задает язык документа;
• spellcheck - позволяет управлять проверкой содержимого элемента на ошибки;
• style - содержит описание стилей CSS, рекомендуется определять стили в отдельном файле;
• tabindex - числовой атрибут, указывающий, может ли элемент получать фокус;
• title - содержит текст, который показывается в виде всплывающей подсказки при наведении курсора на элемент;
• translate - атрибут, используемый для того, чтобы указать, следует ли переводить значения атрибутов элемента и его текстовое содержимое при локализации страницы.

Кроме основных атрибутов, возможно понадобится использовать дополнительные глобальные атрибуты:

• xml:lang и xml:base - остались от спецификации XHTML, сохранены в целях совместимости;
• aria-* - атрибуты, которые применяются для улучшения доступности сайта для людей с разными возможностями здоровья;
• атрибуты обработчиков событий: onabort, onautocomplete, onautocompleteerror, onblur, oncancel, oncanplay, oncanplaythrough, onchange, onclick, onclose, oncontextmenu, oncuechange, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onsort, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting.

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

Таким образом, мы рассмотрели, что такое атрибут в HTML и какие бывают глобальные атрибуты в этом языке.