Читать «HTML5. Недостающее руководство» онлайн - страница 316

Мэтью Мак-Дональд

Если вы знакомы с основами объектно - ориентированного программирования, то должны знать, что такое свойства и методы. Если же нет, то свойства можно предста-вить как прикрепленные к объекту данные, а методы, как встроенные в объект функ-ции.

titleObject.innerHTML = "This Page Is Dynamic"; Этот код присваивает свойству innerHTML объекта titleObject (это наш элемент <h1> ) текстовое значение, которое отображается как содержимое этого элемента. Свойство innerHTML — это всего лишь один аспект объекта HTML, который можно изменять. Для создания кода для работы со свойствами объектов нужно знать, ка-кие свойства JavaScript разрешает модифицировать. Очевидно, что некоторые свойства относятся только к определенным элементам HTML, например атрибут src , который используется для загрузки изображения в элемент <img> :

А посредством свойств объекта style можно изменять свойства CSS: titleObject.style.color = "rgb(0,191,255)"; Современные браузеры поддерживают огромный список свойств DOM, которые можно использовать практически со всеми элементами HTML. Некоторые из наи-более полезных свойств приведены в табл. П2.3.

Таблица П2.3. Наиболее употребляемые свойства объектов HTML

Таблица П2.3 (окончание)

Элементы HTML также имеют небольшой набор полезных методов, включая методы для модифицирования атрибутов, такие как getAttribute() и setAttribute() , а также для добавления или удаления элементов, такие как insertChild() , appendChild() и removeChild() . Дополнительную информацию о свойствах и мето-дах, поддерживаемых определенными элементами HTML, см. в справочной докумен-тации от Mozilla по адресу http://developer.mozilla.org/en/DOM/element .

Динамическое подключение к событию В разд. "Реагирование на события" ранее в этом приложении мы рассмотрели, как запустить функцию на исполнения с помощью атрибута события. Но событие так-же можно подключить к функции, используя код JavaScript. В большинстве случаев, скорее всего, для подключения события к коду следует ис-пользовать атрибуты событий. Но в некоторых случаях этот подход невозможен или неудобен. Одним из самых распространенных примеров будет создание объек-та HTML в коде и последующее динамическое добавление его в страницу. В дан-ной ситуации разметка для нового элемента отсутствует, вследствие чего использо-вание атрибута события не возможно. (Этот метод применяется в примере рисова-ния на холсте в главе 6. ) Другим примером будет подключение события к встроенному объекту, а не к элементу. (Этот случай рассматривается в примерах обработки событий хранилища в главе 9. ) По всем этим причинам важно понимать, как подключать события к коду.

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