Объектная модель документа. Динамический HTML Делает страницу интерактивной Вместо дополнительных запросов к серверу на действия пользователя реагирует. - презентация

1 Объектная модель документа

2 Динамический HTML Делает страницу интерактивной Вместо дополнительных запросов к серверу на действия пользователя реагирует сама страница Сокращается время реакции на действия пользователя Может снизиться нагрузка на сервер

3 Объектная модель документа

4 Объект window Свойства: closed – закрыто ли окно name – имя окна opener – окно, из которого открыто parent – окно родительского фрейма top – внешний фрейм

5 Объект window Методы: alert(«сообщение») – выдаёт сообщение confirm(«сообщение») prompt(«сообщение», «нач.знач.») close() open(url, «имя окна», «атрибуты») setTimeout("код", милисекунды) clearTimeout() setInterval()

6 Создание окон Атрибут target элемента A. Значения: _blank, _self, _parent, _top open(url, «имя окна», «атрибуты») url может быть пустой строкой атрибуты: toolbar, location, directories, status, menubar, scrollbars, resizable, width, height например: 'toolbar=no,location=no,menubar=no,width=200, height=180'

7 Объект document Свойства: all[] – коллекция (массив) всех элементов cookie location images[] forms[] referrer title bgColor fgColor Методы: write(«текст») writeln(«текст») clear() close() open() blur() getElementById(«id»)

8 Объект location Свойства: protocol host hostname port pathname search – запрос hash – метка (без #) href Методы: reload() replace(url) assign(url)

9 Объект history Свойства: length Методы: back() forward() go(url или смещение)

10 Объект navigator Свойства: appName appVersion userAgent appCodeName Методы: javaEnabled()

11 Объект screen Свойства: width height

12 Объект event Свойства: type keyCode x, y layerX, layerY, clientX, clientY, pageX, pageY

13 Объект image Коллекция всех изображений – images[] Свойство src – изменяемое Например: document.images[0].src='second.gif';

14 Объект типа стиль border borderBottom borderTop borderRight borderLeft borderStyle borderTopColor... borderTopWidth... borderTopStyle... clear color cursor display font fontSize … left top width height