Общие атрибуты
После того как стало очевидно, что за HTML должно остаться только логическое форматирование (функции экранного формати- рования перенесены в CSS) и возникла потребность в организации взаимодействия с пользователем на странице (обозреватели начали обрабатывать конструкции JavaScript), в стандарт HTML были до- бавлены следующие общие для каждого тега атрибуты:
• id (identification) – персонализирующий атрибут в пре- делах документа, используется для назначения стилей, в качестве закладки (см. п. 2.3.), позволяет управлять ат- рибутами тега и его содержимым через JavaScript, в том числе извлекать данные. Исходя из перечисленного выше, должен назначаться только одной конкретной копии тега. Если одинаковый id будет присвоен разным
тегам, то это в большинстве случаев вызовет сбой как в оформлении страницы, так и при работе сценариев кли- ента. Атрибут игнорируется для тегов, употребляющих- ся в заголовке HTML-документа;
• class – атрибут определяет, что элемент принадлежит к определенному классу (классам), что позволяет визуа- лизировать элемент в соответствии с заранее заданными правилами. Атрибут игнорируется для невизуализируе- мых тегов;
• style – атрибут позволяет управлять визуализацией дан- ной конкретной копией тега, задав в качестве значений атрибута инструкции CSS;
• title – атрибут, описывающий краткое содержание эле- мента. Он часто выводится обозревателями как всплы- вающая подсказка (tooltip), которая выводится на экран, когда курсор помещается на данный элемент. Атрибут особенно полезен в элементах <a>, <img> и <object>, в которых он указывает на титул связанного или вложен- ного ресурса;
• атрибуты, которые определяют реакцию данного эле-
мента на различные события (табл. 2.3).
Названия атрибутов и реакция на события
Таблица 2.3
|
Имя события |
Происходит |
|
onClick |
при щелчке кнопки мыши на элементе |
|
onDblClick |
при двойном щелчке кнопки мыши на элементе |
|
onMouseDown |
при нажатии кнопки мыши на элементе |
|
onMouseUp |
при отпускании кнопки мыши на элементе |
|
onMouseOver |
при попадании курсора мыши на элемент |
|
onMouseMove |
при движении курсора мыши по элементу |
|
onMouseOut |
при попадании курсора мыши за пределы элемен- та |
|
onKeyPress |
при нажатии и отпускании клавиши на элементе |
|
onKeyDown |
при нажатии клавиши на элементе |
|
onKeyUp |
при отпускании клавиши на элементе |
Задачи для самоконтроля
1. Создать страницу, на которой были бы представлены все категории HTML-элементов.
2. Создать кольцо из трех HTML-документов. Из каждой страницы можно попасть только на одну из подготов- ленных страниц. Ссылки должны идти с изображения, из текста внутри таблицы и с заголовка.
3. Сделать страницу с автобиографией, на которой размес-
тить свою фотографию и сделать как минимум три раз-
дела: родители, школьный и вузовский периоды жизни.
Источник: Филиппов С.А. Основы современного веб-программирования: Учебное пособие. М.: НИЯУ МИФИ, 2011. – 160 с.