Модель DOM уровня 1 пытается стандартизировать объект Document JavaScript в области поддержки произвольных элементов HTML и текстовых объектов, в то же время обеспечивая поддержку наиболее широко используемых свойств, коллекций и методов объекта Document. Обратная совместимость, часто связываемая с DOM уровня 0, достаточно хорошо согласуется с тем, что предлагалось в Netscape 3, за исключением доступа JavaScript к модулям расширений. Свойства объекта Document, поддерживаемые в DOM уровня 1, представлены в таблице.
| Свойство или коллекция объекта Document |
Описание |
| anchors[] |
Коллекция анкеров, заданных с помощью <a пате="имя"> |
| applets[] |
Коллекция аплетов Java на странице, заданных с помощью дескрипторов <applet> |
| body |
Ссылка на объект, представляющий дескриптор <body>, содержащий отображаемый документ |
| cookie |
Строка, содержащая значение cookie документа, если таковое имеется |
| doсtype |
Ссылка на шаблон DTD (Document Type Definition — определение типа документа) документа |
| documentElement |
Ссылка на корневой элемент документа (в HTML это дескриптор <html>) |
| domain |
Область защиты документа |
| forms[] |
Дескрипторы <form> на странице |
| images[] |
Коллекция изображений, определенных с помощью <img> |
| implementation |
Ссылка на объект, который может определять возможности языка разметки данного документа |
| links[] |
Содержит адрес URL ссылающегося объекта, если он определен |
| referrer |
Коллекция ссылок, указанных дескрипторами <а> и <агеа> документа |
| title |
Заголовок документа |
| URL |
Строка, содержащая адрес URL документа |
Обратите внимание на то, что в DOM сохраняется поддержка многих обсуждавшихся выше коллекций и добавляется лишь несколько свойств, таких как body, docType и documentElement. Единственным отсутствующим свойством является lastModified, но, к счастью, браузеры продолжают его поддерживать.
Что касается методов, то традиционно объект Document поддерживает только open(), close(), clear(), write() и writeln(). В модели DOM уровня 1 отказались от поддержки метода clear(), который никогда по-настоящему и не использовался. Однако, кроме статических по своим действиям методов write(), модель DOM предлагает и множество методов, предназначенных для динамического создания объектов. В нее добавлен, например, метод createComment {данные), который создает комментарий (X)HTML вида <! -- данные —>, createElement {дескриптор), который создает элемент (X)HTML соответствующего типа, и createTextNode {данные), который создает текстовый узел, содержащий значение параметра данные. Имеются и другие "создающие" методы DOM, но их польза при работе с документами HTML весьма ограничена.
Мы также видели в разделе
"Другие свойства доступа", что в DOM добавлены три полезных метода для выяснения адреса назначения документа:
- document.getElementById(idЭлемента) — возвращает ссылку на объект с id= "idЭлемента";
- document.getElementsByName(имяЭлемента) — возвращает список всех объектов элементов (X)HTML с name= "имяЭлемента";
- document. getElementsByTagName(дескриптор) — возвращает список всех элементов (X)HTML указанного параметром дескриптор типа (например, STRONG).
Получив объект, мы можем посмотреть на его свойства. Например, снова вспомним из главы 10, что каждый узел DOM, включающий элемент (X)HTML, будет иметь набор свойств, связанных с его размещением в дереве документа; это parentNode, childNodes.firstChild, lastChild, previousSibling и next Sibling. Есть также множество методов, например insertBefore(), для добавления узлов в документ — как дескрипторов HTML, так и узлов текста. Имеются также свойства для работы со значениями атрибутов, но чаще всего это проще выполнить непосредственно, как мы продемонстрируем позже.
Следует также понимать, что кроме свойств, определенных в рамках DOM, в соответствии с HTML 4 и XHTML все элементы имеют общий набор свойств, связанных с элементами сценария, таблицами стилей и возможностями доступа (id, class, style и title), а также с использованием языка (lang и dir). Соединив все это, вы получите комплект свойств и методов, общих для любого элемента HTML, представленного в JavaScript. В DOM этот объект называется HTMLElement, а его свойства и методы приводятся в таблице ниже.
| Свойство или коллекция объекта HTMLElement |
Описание |
| attributes[ ] |
Коллекция атрибутов элемента, если таковые имеются |
| childNodes[ ] |
Коллекция узлов (узлы текста, элементы и т.д.), включенных в данный элемент HTML |
| className |
Значение атрибута class |
| dir |
Направление текста: LTR (left to right — слева на право) или RTL (right to left — справа налево), в соответствии с установками атрибута dir |
| firstChild |
Ссылка на первый узел, непосредственно включенный в текущий элемент HTML. То же, что и element. childNodes[0]. Дочерние узлы могут быть любого типа, а не только элементами HTML |
| id |
Текстовая строка, соответствующая значению атрибута id элемента |
| lang |
Код языка, заданный атрибутом iang элемента |
| lastChild |
Ссылка на последний дочерний элемент в списке дочерних узлов, являющихся прямыми потомками текущего элемента HTML |
| nodeName |
Название элемента HTML, например Р. Тоже, что и tagName |
| nodeValue |
Значение узла. Это свойство всегда равно null в случае элементов HTML |
| nodeType |
Числовой код для типа узла. В случае элементов HTML всегда равно 1 |
| nextSibling |
Ссылка на следующий сестринский узел D0M текущего элемента HTML |
| ownerDocument |
Ссылка на объект Document, содержащий текущий элемент |
| parentNode |
Ссылка на объемлющий элемент HTML |
| previousSibling |
Ссылка на предыдущий сестринский узел DOM текущего элемента HTML |
| style |
Доступ к внутристрочным спецификациям стиля для данного элемента. Это свойство D0M уровня 2 |
| tagName |
Ссылка на имя элемента HTML, например OL. То же, что и nodeName, в случае узлов элементов |
| title |
Строка с текстом подсказки, установленным с помощью атрибута title элемента |
Общие методы объекта HTMLElement
| Имя метода |
Описание |
| appendChild (newChild) |
Добавляет узел newChild в качестве последнего дочернего для текущего элемента |
| cloneNode (deep) |
Делает копию текущего элемента HTML. Если параметр deep равен true, копия будет содержать все узлы, включенные в данный элемент |
| getAttribute (ИМЯ) |
Возвращает значение атрибута, указанного параметром имя. Проще ссылаться прямо через имя атрибута, если оно известно. Например, если myP1 представляет абзац, то myP1. align будет содержать значение его атрибута align |
| getElementsByTagName (tagName) |
Возвращает список элементов, указанных параметром tagName, содержащихся в рамках данного элемента |
| hasChildNodes() |
Возвращает значение типа Boolean, указывающее, имеет ли текущий элемент дочерние (вложенные элементы или узлы текста) |
| insertBefore( newChild, refChild) |
Вставляет узел newChild в список дочерних узлов данного элемента непосредственно перед узлом, указанным аргументом refChild |
| removeAttribute (ИМЯ) |
Удаляет атрибут, указанный параметром имя. Например, myP1. removeAttribute ("align") удалит атрибут align для абзаца myP1. Конечно, проще присвоить атрибуту его значение по умолчанию |
| removeChild (OldChild) |
Удаляет узел, указанный аргументом oldChild |
| replaceChild (newChild, oldChild) |
Заменяет узел oldChild новым узлом newChild |
| setAttribute (имя, значение) |
Устанавливает значение атрибута. Проще использовать прямую ссылку, если известно имя атрибута. Например, если myP1 соответствует абзацу, то тур; align будет содержать значение атрибута align этого абзаца |