Общее описание
Основные различия между DOM и Internet Explorer
В этой главе мы описываем модель обработки событий, принятую в Internet Explorer (далее IE). Она отличается от модели обработки событий в DOM, поэтому начнем с краткого обзора различий между этими двумя моделями.
Просачивание событий и отмена типовой обработки события в IE имеют тот же смысл, что в DOM, но реализованы другими свойствами и методами. Механизм перехвата событий реализован только для событий, генерируемых мышью (см. setCapture и releaseCapture).
Интерфейс EventTarget узлами документа в IE не поддерживается. Вместо него есть нестандартные методы attachEvent, detachEvent и fireEvent.
В IE поддерживается нестандартный синтаксис создания обработчиков событий с помощью атрибутов for и event в теге SCRIPT, описанный ниже.
Если в DOM объект event передается обработчику события как аргумент вызова (и, соответственно, недоступен вне тела этого обработчика), то в IE объект event является свойством объекта window, которое инициализируется всякий раз, когда генерируется событие. Поэтому этот объект является глобальным и указывать его в списке аргументов обработчика событий не обязательно. Кроме того, объекты event в DOM и IE различны по набору своих свойств и методов (см. этот пункт).
Набор событий, генерируемых в IE, отличается от набора, предусмотренного в DOM (см. этот пункт).
Теперь рассмотрим перечисленные различия подробно.
Жизненный цикл события
Для того, чтобы уяснить модель обработки событий в IE, начнем с описания жизненного цикла события в этом обозревателе. Этот цикл состоит из следующих фаз:
Выполняется действие пользователя или иное условие, порождающее событие.
Создается объект window.event, в который заносятся свойства сгенерированного события.
Объектная модель документа оповещается о том, что произошло новое событие. Для этого вызывается обработчик данного события того элемента дерева документа, в котором это событие произошло.
Обработчик выполняет указанные в нем действия и завершает работу. После этого событие просачивается в обработчик событий его отца в дереве документа и т. д. до тех пор, пока не будет достигнут объект window или пока какой-нибудь из обработчиков в этой цепочке не прервет просачивание.
Если событие имеет типовую обработку и она не была отменена предшествующими обработчиками, то выполняется типовая обработка события.
Статическое создание обработчиков событий
IE предусматривает два статических способа создания обработчиков событий. Во-первых, мы можем использовать стандартный синтаксис HTML 4.0 с использованием атрибутов on:, например:
<IMG src="sample.gif" onclick="mouseClick()">
В атрибуте on: мы можем указать любое выражение JavaScript, например:
<BUTTON onclick="javascript: alert('Молодец!')">Нажми меня</BUTTON>
Во-вторых, IE поддерживает расширенный синтаксис элемента SCRIPT с использованием следующих нестандартных атрибутов:
Атрибуты: event = CDATA (тип событий)
for = IDREF (идентификатор элемента)
Здесь атрибут for задает идентификатор HTML-элемента, к которому будет присоединен данный обработчик, а атрибут event задает тип событий, которые он должен обрабатывать. В следующем примере создается обработчик щелчка мыши на графическом образе с идентификатором myImage:
<SCRIPT for="myImage" event="onclick">
. . .
</SCRIPT>
. . .
<IMG id="myImage" src="sample.gif">
Различие между этими способами создания обработчиков событий состоит в моменте их активизации в процессе загрузки документа. Обработчик событий, созданный первым способом, начинает обрабатывать возникающие события, как только будет создан элемент, в котором он описан атрибутом on:; обработчик событий, созданный вторым способом, начинает работать только после загрузки всего документа. Поскольку в процессе загрузки документа могут генерироваться различные события, такая схема предоставляет нам большую гибкость, чем стандартная модель DOM.
Динамическое создание обработчиков событий
Для динамического создания обработчиков событий также есть два способа. Во-первых, мы можем присоединить обработчик события к элементу через его DOM-атрибут on:, например:
<IMG id="myImage" src="sample.gif">
. . .
<SCRIPT>
document.getElementById("myImage").onclick = "mouseClick()";
</SCRIPT>
Во-вторых, мы можем подключить обработку событий вызовом нестандартного метода attachEvent.
Область действия обработчиков событий
IE предусматривает различное поведение обработчиков событий в зависимости от того, связаны они с управляющими элементами формы или нет. Если да, то поведение определяется местоположением сценария - внутри или вне элемента FORM. При этом возможны следующие варианты.
Элемент, генерирующий события, расположен вне формы. В этом случае его обработчик событий также должен располагаться вне формы; в противном случае он игнорируется.
Элемент, генерирующий события, расположен внутри формы. Если он имеет уникальный для всего документа идентификатор, то его обработчик событий может располагаться в любом месте документа. В противном случае он должен располагаться внутри той же формы.
1 2 3 4
8 8 8
| |
*
Обратная связь