Модель событий dom
Особенностью программ, создаваемых для среды веб является то, что они управляются событиями. Чтобы узнать, какое событие произошло, в DOM имеется объект события event (табл. 15). Объект event является локальным и его следует явным образом передавать в обработчик события.
Таблица 15
Свойства объекта event
Свойство | Описание |
bubbles | Указывает возможность «всплывания» события (передачи управления вверх по иерархической структуре) |
cancelable | Указывает возможность отмены действия события, заданного по умолчанию |
currentTarget | Указывает событие, обрабатываемое в данный момент |
eventPhase | Указывает фазу возбуждения события |
target (только NN 6) | Указывает элемент, вызвавший событие |
timestamp (только NN 6) | Указывает время возникновения события |
type | Указывает имя события |
События, связанные с мышью, генерируют объект mouse (табл. 16).
Приведем пример динамически изменяемого текста.
<html> <head> <script language = "JavaScript"> function onMouseover() { var temp = document.getElementById("DynamicText"); temp.firstChild.nodeValue = "Указатель мыши на тексте"; temp.style.color = "red"; } function onMouseout() { var temp = document.getElementById("DynamicText"); temp.firstChild.nodeValue = "Динамический текст"; temp.style.color = "black"; } </script> <title>Динамический текст</title> </head> <body> <p id = "DynamicText" onmouseover = "return onMouseover()" onmouseout = "return onMouseout()">Динамический текст</p> </body> <html>
Таблица 16
Свойства объекта mouse
Свойство | Описание |
altKey | Указывает, была ли нажата клавиша <Alt> в момент возникновения события |
button | Указывает, какая клавиша мыши была нажата |
clientX | Сообщает горизонтальную координату указателя мыши в окне браузера на момент возникновения события |
clientY | Сообщает вертикальную координату указателя мыши в окне браузера на момент возникновения события |
ctrKey | Указывает, была ли нажата клавиша <Ctrl> в момент возникновения события |
metaKey | Указывает, была ли нажата метаклавиша в момент возникновения события |
relatedTarget (только NN 6) | Указывает цель события |
screenX | Сообщает горизонтальную координату указателя мыши в окне браузера, вычисленную от начала экранных координат, на момент возникновения события |
screenY | Сообщает вертикальную координату указателя мыши в окне браузера, вычисленную от начала экранных координат, на момент возникновения события |
shiftKey | Указывает, была ли нажата клавиша <Shift> в момент возникновения события |
Пример, определяющий координаты нахождения курсора мыши.
<html> <head> <title>Определение координат курсора</title> <script language = "JavaScript"> function onClick(e) { alert("X = " + e.clientX + "; " + "Y = " + e.clientY); } </script> </head> <body onclick = "onClick(event)"> <p>Щелкните мышью на экране<p> </body> </html>
- Введение
- 2. Основы сетевых технологий
- Применение компьютерных сетей
- Классификация компьютерных сетей
- Беспроводные сети
- Широковещательные сети и сети с передачей от узла к узлу
- Локальные сети
- Муниципальные сети
- Глобальные сети и интерсети
- 3. Принципы построения сетевых протоколов Иерархия сетевых протоколов
- Метафора «философ – переводчик – секретарь»
- Пример пятиуровневого протокола
- 4. Arpanet и возникновение интернет
- 5. Топология internet
- 6. Маршрутизация
- Маршрутизация в сетях на основе служб без установления соединения
- Маршрутизация в сетях на основе служб с установлением соединения
- 8. Служба доменных имен (dns)
- 9. Электронная почта
- 11. Введение в web-технологии
- Структура html-документа
- Теги заголовков и абзацев
- Маркированные списки
- Нумерованные списки
- Списки определений
- Вложенные списки
- Гиперссылки
- Использование рисунков в роли ссылок
- Карты изображений
- Основы JavaScript
- Управляющие структуры JavaScript
- 15. Введение в объектно-ориентированное программирование Основные понятия объектно-ориентированного программирования: инкапсуляция, наследование и полиморфизм
- Объектно-ориентированные, объектные и объектно-базированные языки программирования
- Избранная библиография по объектно-ориентрованному программированию
- Представление документа в виде древовидной структуры
- Навигация по документу
- Динамическая генерация веб-страниц средствами dhtml на основе dom
- Модель событий dom
- 17. Архитектура распределенной системы структурно-параметрического синтеза
- 18. Заключение
- Оглавление