События объекта window
Остановимся вкратце на событиях, связанных с объектом window. Обработчики этих событий обычно помещают как атрибут контейнера <BODY>.
10.4.1 Load — событие происходит в момент, когда загрузка документа в данном окне полностью закончилась. Если текущим окном является фрейм, то событие Load его объекта window происходит, когда в данном фрейме загрузка документа закончилась, независимо от состояния загрузки документов в других фреймах. Использовать обработчик данного события можно, например, следующим образом:
| <BODY onLoad="alert('Документ полностью загружен.');"> |
10.4.2 Unload — событие происходит в момент выгрузки страницы из окна. Например, когда пользователь закрывает окно, либо переходит с данной Web-страницы на другую, кликнув ссылку или набрав адрес в адресной строке, либо при изменении адреса страницы (свойства window.location) скриптом. Например, при уходе пользователя с нашей страницы мы можем позаботиться о его удобстве и закрыть открытое ранее нашим скриптом окно:
| <BODY onUnload="myWin.close();"> |
10.4.3 Error — событие происходит при возникновении ошибки в процессе загрузки страницы. Если это событие произошло, можно, например, вывести сообщение пользователю с помощью alert() или попытаться перезагрузить страницу с помощью window.location.reload(). В следующем примере мы назначаем обработчиком события Error функцию ff(), которая будет выдавать сообщение. В тексте программы мы допустили ошибку: слово Alert написано с заглавной буквы (помните, что в JavaScript это недопустимо?). Поэтому при открытии этого примера возникнет ошибка и пользователь получит об этом "дружественное" сообщение.
| <SCRIPT> function ff() { alert('Произошла ошибка. Свяжитесь с Web-мастером.'); } window.onerror = ff; Alert('Привет'); </SCRIPT> |
10.4.4 Focus — событие происходит в момент, когда окну передается фокус. Например, когда пользователь "раскрывает" свернутое ранее окно, либо (в Windows) выбирает это окно браузера с помощью Alt+Tab среди окон других приложений. Это событие происходит также при программной передаче фокуса данному окну путем вызова метода window.focus(). Пример использования:
| <BODY onFocus="alert('Спасибо, что снова вернулись!');"> |
10.4.5 Blur — событие, противоположное предыдущему, происходит в момент, когда данное окно теряет фокус. Это может произойти в результате действий пользователя либо программными средствами — вызовом метода window.blur().
10.4.6 Resize — событие происходит при изменении размеров окна пользователем либо сценарием.
Объект document
10.5.1 Объект document является важнейшим свойством объекта window (полностью к нему нужно обращаться как window.document). Все элементы HTML-разметки, присутствующие на web-странице, — текст, абзацы, гиперссылки, картинки, списки, таблицы, формы и т.д. — являются свойствами объекта document. Можно сказать, что технология DHTML (Dynamic HTML), т.е. динамическое изменение содержимого web-страницы, заключается именно в работе со свойствами, методами и событиями объекта document.
Таблица 10.3 - Свойства, методы и события объекта document
| Свойства | Методы | События |
| URL domain title lastModified referrer cookie linkColor alinkColor vlinkColor | open() close() write() writeln() getSelection() getElementById() getElementsByName() getElementsByTagName() | Load Unload Click DblClick MouseDown MouseUp KeyDown KeyUp KeyPress |
10.5.2 Методы объекта document: перечислим основные методы.
document.getElementById - возвращает один элемент на основе его ID. Пример: document.getElementById('id5') выдаст тот HTML-элемент, у которого был задан атрибут ID="id5";
document.getElementsByName - возвращает массив элементов, определенных по имени. В отличие от ID многие элементы могут иметь на странице одинаковые имена, например document.getElementsByName('important');
document.getElementsByTagName - возвращает массив элементов, определенных по имени тега, например document.getElementsByTagName('P'). Имя тега является просто именем тега HTML, т.е. 'DIV', 'IMG', 'TABLE', 'A 'и т.д.
document.write() — он пишет в текущий HTML-документ. Его модификация document.writeln() делает то же самое, но дополнительно добавляет в конце символ новой строки; это удобно, если потом требуется читать сгенерированный HTML-документ глазами. Если запись идет в HTML-документ нового окна, открытого с помощью window.open(), то перед записью в него нужно открыть поток на запись с помощью метода document.open(), а по окончании записи закрыть поток методом document.close(). После выполнения последнего действия произойдет событие Load (и вызовется соответствующий обработчик события onLoad) у документа, а затем у окна.
10.5.3 События объекта document. События onLoad, onUnload объекта document соответствуют тем же событиям объекта window.
Перечислим события от «мыши».
События от мыши «click» происходит при однократном щелчке мышью на элементе HTML – документа. Особенно часто данное событие применяется к элементам электронных форм - LABEL, INPUT, SELECT, TEXTAREA и BUTTON, а так же элементу ссылок.
Следующие два события служат для разделения операции щелчка кнопки на два этапа – нажатие и отпускание кнопки. Событие при нажатии – «mousedown», а при отпускании – «mouseup»
События «mouseOut» происходит при перемещении курсора мыши за пределы элемента.
События от фокуса объекта. Событие «focus» происходит, когда поле получает фокус ввода с клавиатуры, соблюдая последовательность переходов, или щелчком мыши.
Событие «change» происходит, когда поля формы select, text или textarea теряют фокус и их значения изменяются, с момента попадания на него фокуса. Обработчик событий onChange выполняет программу JavaScript, назначение которой, как правило, проверка введенных пользователем данных и подтверждение ввода.
При потере фокуса ввода элементом происходит событие «blur». Оно происходит, не зависимо было, изменено значение поля пользователем, или нет.
10.5.4 Свойства объекта document. Свойства linkColor, alinkColor и vlinkColor задают цвет гиперссылок — непосещенных, активных и посещенных, соответственно.
Свойство domain выдает домен (оно аналогично window.location.hostname).
Свойство title выдает заголовок страницы (указанный в контейнере <TITLE>). Свойство referrer выдает адрес страницы, с которой пользователь пришел на данную web-страницу, кликнув по гиперссылке.
Дата добавления: 2017-02-20; просмотров: 703;