WDH: DHTML - Элементы и атрибуты

Глава 4.4. Элементы и атрибуты

В этой главе мы рассматриваем узлы дерева документа Attr, Element, CharacterData, Text и Comment.

4.4.1. Атрибут: интерфейс Attr

Поддержка:  Поддерживается для XML-документов (XMLDOMAttribute);
              для HTML-документов поддерживается частично.
            Соответствует стандарту.

Интерфейс Attr соответствует атрибуту элемента XML- или HTML-документа. Он наследует интерфейс Node, но поскольку атрибуты фактически не являются детьми элемента, который они описывают, DOM не считает их частью дерева документа. Поэтому значения свойств parentNode, previousSibling и nextSibling для атрибутов всегда равны null.

В XML значение атрибута представляется узлами типа Text и EntityReference, поскольку здесь значения атрибутов могут содержать ссылки на разделы. В HTML значением атрибута является просто строка типа DOMString.

Свойства интерфейса Attr
Свойство	Изменяемое	Модель	Описание
`name`	Нет	DOM 1	Имя атрибута.
`ownerElement`	Нет	DOM 2	Элемент-владелец атрибута.
`specified`	Нет	DOM 1	Явно ли задан атрибут.
`value`	Да	DOM 1	Значение атрибута.

Свойство name

Синтаксис:  атрибут.name
Изменяемое: нет

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Свойство name возвращает строку, содержащую имя данного атрибута. Введение этого свойства в DOM не вполне обоснованно, т. к. его значение всегда совпадает со значением свойства nodeName. По этой причине MSHTML это свойство не поддерживает, и в целях совместимости лучше пользоваться свойством nodeName.

Свойство ownerElement

Синтаксис:  атрибут.ownerElement
Изменяемое: нет

Поддержка:  Не поддерживается.
            Соответствует стандарту.

Свойство ownerElement возвращает указатель на узел Element, атрибутом которого является данный атрибут, или null, если такого элемента нет. Пример: оператор

alert(document.body.attributes[0].ownerElement.tagName)

выведет на экран строку BODY.

Свойство specified

Синтаксис:  атрибут.specified
Изменяемое: нет

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Свойство specified возвращает true, если значение атрибута было явно задано в тексте документа или в сценарии, и false в противном случае. Точнее говоря:

если атрибуту присвоено значение в документе или сценарии, то specified равно true, а значением атрибута является присвоенное значение;
если атрибуту не присваивалось значение в документе или сценарии и он имеет значение по умолчанию, заданное в DTD, то specified равно false, а значением атрибута является значение по умолчанию;
если атрибуту не присваивалось значение в документе или сценарии и он имеет значение #IMPILED в DTD, то этот атрибут не включается в дерево документа;
если свойство атрибута ownerElement равно null, то specified равно true.

Свойство value

Синтаксис:  атрибут.value
Изменяемое: да
Исключения: NO_MODIFICATION_ALLOWED_ERR (при записи)

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Свойство value позволяет задавать и считывать значение данного атрибута. В HTML его значение всегда совпадает со значением свойства nodeValue. По этой причине MSHTML это свойство не поддерживает, и в целях совместимости лучше пользоваться свойством nodeValue.

В XML значение атрибута может содержать ссылки на разделы, поэтому здесь ситуация немного сложнее. При задании значения этого свойства создается новый узел Text, в который заносится содержимое новой строки без ее анализа XML-процессором. При чтении этого свойства ссылки на разделы заменяются на соответствующий текст, а затем возвращается результирующая строка.

4.4.2. Элемент: интерфейс Element

Поддержка:  Поддерживается для XML-документов (XMLDOMEelement);
              для HTML-документов поддерживается частично.
            Соответствует стандарту.

Интерфейс Element соответствует элементу XML- или HTML-документа. Он наследует интерфейс Node.

Свойства интерфейса Element
Свойство	Изменяемое	Модель	Описание
`tagName`	Нет	DOM 1	Имя тега.

Методы интерфейса Element
Метод	Модель	Описание
`getAttribute`	DOM 1	Возвращает значение заданного атрибута.
`getAttributeNS`	DOM 2	Возвращает значение заданного атрибута с учетом пространства имен.
`getAttributeNode`	DOM 1	Возвращает заданный узел Attr.
`getAttributeNodeNS`	DOM 2	Возвращает заданный узел Attr с учетом пространства имен.
`getElementsByTagName`	DOM 1	Возвращает список потомков, имеющих заданный тег.
`getElementsByTagNameNS`	DOM 2	Возвращает список потомков, имеющих заданный тег, с учетом пространства имен.
`hasAttribute`	DOM 2	Проверяет наличие заданного атрибута.
`hasAttributeNS`	DOM 2	Проверяет наличие заданного атрибута с учетом пространства имен.
`removeAttribute`	DOM 1	Удаляет заданный атрибут.
`removeAttributeNS`	DOM 2	Удаляет заданный атрибут с учетом пространства имен.
`removeAttributeNode`	DOM 1	Удаляет заданный узел Attr.
`setAttribute`	DOM 1	Добавляет новый атрибут.
`setAttributeNS`	DOM 2	Добавляет новый атрибут с учетом пространства имен.
`setAttributeNode`	DOM 1	Добавляет новый узел Attr.
`setAttributeNodeNS`	DOM 2	Добавляет новый узел Attr с учетом пространства имен.

Свойство tagName

Синтаксис:  элемент.tagName
Изменяемое: нет

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Свойство tagName возвращает строку, содержащую имя тега данного элемента. Имя тега HTML всегда преобразуется в прописные буквы, тогда как имя тега XML хранится так, как оно задано в документе. Это свойство является избыточным, т. к. его значение всегда совпадает со значением свойства nodeName. Пример: оператор

alert(document.documentElement.tagName);

выведет на экран строку HTML.

Метод getAttribute

Синтаксис:  элемент.getAttribute(name)
Аргументы:  name — выражение типа DOMString
Результат:  значение типа DOMString
Исключения: нет

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Метод getAttribute возвращает значение атрибута, имеющего имя name. Если атрибут не имеет значения, то возвращается пустая строка. Пример:

<BODY text="blue">
<SCRIPT>
alert(document.body.getAttribute("text"));
</SCRIPT>
</BODY>

Оператор alert в Internet Explorer выведет строку #0000ff, а в Gecko — строку blue.

Метод getAttributeNS

Синтаксис:  элемент.getAttributeNS(namespaceURI, localName)
Аргументы:  namespaceURI, localName — выражения типа DOMString
Результат:  значение типа DOMString
Исключения: нет

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод getAttributeNS возвращает значение заданного атрибута. Если атрибут не имеет значения, то возвращается пустая строка. Этот метод предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а localName — локальное имя атрибута.

Метод getAttributeNode

Синтаксис:  элемент.getAttributeNode(name)
Аргументы:  name — выражение типа DOMString
Результат:  значение типа Attr или null
Исключения: нет

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод getAttributeNode возвращает указатель на объект Attr, соответствующий атрибуту с именем name. Если такого атрибута нет, то возвращается null. Пример:

<BODY text="blue">
<SCRIPT>
alert(document.body.getAttributeNode("text").nodeValue);
</SCRIPT>
</BODY>

Оператор alert в Gecko выведет строку blue (Internet Explorer этот метод не поддерживает).

Метод getAttributeNodeNS

Синтаксис:  элемент.getAttributeNodeNS(namespaceURI, localName)
Аргументы:  namespaceURI, localName — выражения типа DOMString
Результат:  значение типа Attr или null
Исключения: нет

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод getAttributeNodeNS возвращает указатель на объект Attr, соответствующий заданному атрибуту. Если такого атрибута нет, то возвращается null. Этот метод предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а localName — локальное имя атрибута.

Метод getElementsByTagName

Синтаксис:  элемент.getElementsByTagName(tagname)
Аргументы:  tagname — выражение типа DOMString
Результат:  объект NodeList
Исключения: нет

Поддержка:  Соответствует стандарту (см. примечание).
            Соответствует стандарту.

Метод getElementsByTagName создает новый объект NodeList, состоящий из всех потомков данного элемента типа Element, имеющих заданное имя и возвращает указатель на него. Аргумент tagname задает искомый тег; если он равен "*", то возвращается список всех элементов документа.

Примечание. Internet Explorer не поддерживает специальное имя "*". В нем вместо element.getElementsByTagName("*") следует использовать нестандартное свойство element.all.

Следующий пример выводит на экран количество графических образов в документе, а затем URI первого образа:

var imgList = document.body.getElementsByTagName("IMG");
alert(imgList.length);
alert(imgList[0].src);

Метод getElementsByTagNameNS

Синтаксис:  элемент.getElementsByTagNameNS(namespaceURI, localName)
Аргументы:  namespaceURI, localName — выражения типа DOMString
Результат:  объект NodeList
Исключения: нет

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод getElementsByTagNameNS создает новый объект NodeList, состоящий из всех потомков данного элемента типа Element, имеющих заданное имя и возвращает указатель на него. Он предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а localName — локальное имя искомого тега в этом пространстве имен; если он равен "*", то возвращается список всех элементов документа, относящихся к данному словарю.

Метод hasAttribute

Синтаксис:  элемент.hasAttribute(name)
Аргументы:  name — выражение типа DOMString
Результат:  логическое значение
Исключения: нет

Поддержка:  Не поддерживается.
            Соответствует стандарту.

Метод hasAttribute возвращает true, если элемент имеет атрибут с именем name, и false в противном случае. Пример:

<BODY text="blue">
<SCRIPT>
alert(document.body.hasAttribute("text"));
alert(document.body.hasAttribute("size"));
</SCRIPT>
</BODY>

Первый оператор alert выведет в Gecko строку true, второй — строку false.

Метод hasAttributeNS

Синтаксис:  элемент.hasAttributeNS(namespaceURI, localName)
Аргументы:  namespaceURI, localName — выражения типа DOMString
Результат:  логическое значение
Исключения: нет

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод hasAttributeNS возвращает true, если элемент имеет заданный атрибут, и false в противном случае. Он предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а localName — локальное имя атрибута.

Метод removeAttribute

Синтаксис:  элемент.removeAttribute(name)
Аргументы:  name — выражение типа DOMString
Исключения: NO_MODIFICATION_ALLOWED_ERR

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Метод removeAttribute удаляет атрибут с именем name. Если атрибут имеет значение по умолчанию, то он немедленно появляется вновь, со значением по умолчанию. Пример:

var elem = document.getElementsByTagName("BODY")[0];
elem.removeAttribute("text");
alert(elem.getAttribute("text"));

Оператор alert выведет на экран пустую строку.

Метод removeAttributeNS

Синтаксис:  элемент.removeAttributeNS(namespaceURI, localName)
Аргументы:  namespaceURI, localName — выражения типа DOMString
Исключения: NO_MODIFICATION_ALLOWED_ERR

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод removeAttributeNS удаляет заданный атрибут. Если атрибут имеет значение по умолчанию, то он немедленно появляется вновь, со значением по умолчанию. Этот метод предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а localName — локальное имя атрибута.

Метод removeAttributeNode

Синтаксис:  элемент.removeAttributeNode(oldAttr)
Аргументы:  oldAttr — выражение типа Attr
Результат:  объект типа Attr
Исключения: NO_MODIFICATION_ALLOWED_ERR, NOT_FOUND_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод removeAttributeNode удаляет заданный узел oldAttr и возвращает указатель на него. Если атрибут имеет значение по умолчанию, то он немедленно появляется вновь, со значением по умолчанию. Пример:

document.body.removeAttributeNode(elem.getAttributeNode("text"));

Метод setAttribute

Синтаксис:  элемент.setAttribute(name, value)
Аргументы:  name, value — выражения типа DOMString
Исключения: INVALID_CHARACTER_ERR, NO_MODIFICATION_ALLOWED_ERR

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Метод setAttribute создает новый атрибут с именем name и значением value. Если атрибут с таким именем уже есть, то ему просто присваивается новое значение. Следующий пример изменяет цвет отображения текста документа на зеленый:

document.body.setAttribute("text", "green");

При работе с XML-документами следует учитывать, что значение value рассматривается как обычная строка и не анализируется XML-процессором. Поэтому если мы хотим присвоить атрибуту значение, содержащее ссылки на разделы, то должны сначала создать новый узел Attr, затем создать необходимые узлы Text и EntityReference, включить их в дерево атрибута и присоединить все созданное дерево к элементу методом setAttributeNode.

Метод setAttributeNS

Синтаксис:  элемент.setAttributeNS(namespaceURI, qualifiedName, value)
Аргументы:  namespaceURI, qualifiedName, value — выражения типа DOMString
Исключения: INVALID_CHARACTER_ERR, NO_MODIFICATION_ALLOWED_ERR, NAMESPACE_ERR

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод setAttributeNS создает новый атрибут с заданным именем и значением value. Если атрибут с таким именем уже есть, то ему просто присваивается новое значение. Этот метод предназначен для XML-документов и для HTML-документов может не поддерживаться. Аргумент namespaceURI задает URI пространства имен, а qualifiedName — ограниченное имя атрибута. При работе с XML-документами следует учитывать замечания к методу setAttribute.

Метод setAttributeNode

Синтаксис:  элемент.setAttributeNode(newAttr)
Аргументы:  newAttr — выражение типа Attr
Результат:  объект типа Attr или null
Исключения: WRONG_DOCUMENT_ERR, NO_MODIFICATION_ALLOWED_ERR, INUSE_ATTRIBUTE_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод setAttributeNode добавляет к данному элементу новый узел newAttr. Если атрибут с именем newAttr.nodeName уже есть, то он заменяется на новый узел, а указатель на старый узел возвращается в качестве результата. Если такого атрибута нет, то возвращается null. Пример:

var attr = document.createAttribute("temp");
attr.value = "temporary";
document.body.setAttributeNode(attr);
alert(document.body.getAttribute("temp"));

Оператор alert в Gecko выведет на экран строку temporary.

Метод setAttributeNodeNS

Синтаксис:  элемент.setAttributeNodeNS(newAttr)
Аргументы:  newAttr — выражение типа Attr
Результат:  объект типа Attr или null
Исключения: WRONG_DOCUMENT_ERR, NO_MODIFICATION_ALLOWED_ERR, INUSE_ATTRIBUTE_ERR

Поддержка:  Не поддерживается.
            Не поддерживается.

Метод setAttributeNodeNS добавляет к данному элементу новый узел newAttr. Если атрибут с такими же newAttr.localName и newAttr.namespaceURI уже есть, то он заменяется на новый узел, а указатель на старый узел возвращается в качестве результата. Если такого атрибута нет, то возвращается null. Этот метод предназначен для XML-документов и для HTML-документов может не поддерживаться.

4.4.3. Символьные данные: интерфейс CharacterData

Поддержка:  Поддерживается для XML-документов (XMLDOMCharacterData);
              для HTML-документов поддерживается частично.
            Соответствует стандарту.

Интерфейс CharacterData инкапсулирует свойства и методы, присущие узлам, содержащим текстовые данные. Самостоятельно он не употребляется, а только служит прототипом для интерфейсов Text и Comment. Этот интерфейс спроектирован так, чтобы поддерживать большие объемы текстовой информации в XML-документах, которые могут не помещаться в символьные строки сценарных языков. Для HTML-документов эта проблема не актуальна, и мы можем работать с содержимым текстовых узлов как с обычными строками JavaScript. Напомним, что текстовые строки представляются в DOM строками символов формата UTF-16, а нумерация символов в строке начинается с нуля.

Свойства интерфейса CharacterData
Свойство	Изменяемое	Модель	Описание
`data`	Да	DOM 1	Символьные данные узла.
`length`	Нет	DOM 1	Количество символов в `data`.

Методы интерфейса CharacterData
Метод	Модель	Описание
`appendData`	DOM 1	Добавляет строку в конец данных узла.
`deleteData`	DOM 1	Удаляет фрагмент данных узла.
`insertData`	DOM 1	Вставляет строку в заданное место данных узла.
`replaceData`	DOM 1	Заменяет фрагмент данных узла на новую строку.
`substringData`	DOM 1	Извлекает фрагмент данных узла.

Свойство data

Синтаксис:  узел.data
Изменяемое: да
Исключения: NO_MODIFICATION_ALLOWED_ERR (при записи), DOMSTRING_SIZE_ERR (при чтении)

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Свойство data задает или возвращает строку, содержащую текстовое содержимое данного узла. Пример:

var node = document.createTextNode("Мой текст");
node.data = "Новый текст";
alert(node.data);

Оператор alert выведет на экран строку Новый текст.

Свойство length

Синтаксис:  узел.length
Изменяемое: нет

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Свойство length возвращает беззнаковое целое число, равное количеству символов в текстовом содержимом узла. Пример:

var node = document.createTextNode("Мой текст");
alert(node.length);

Оператор alert выведет на экран число 9.

Метод appendData

Синтаксис:  элемент.appendData(arg)
Аргументы:  arg — выражение типа DOMString
Исключения: NO_MODIFICATION_ALLOWED_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод appendData добавляет в конец текстового содержимого узла строку arg. Пример:

var node = document.createTextNode("12345");
node.appendData("67890");
alert(node.data);

Оператор alert выведет в Gecko на экран строку 1234567890. В Internet Explorer вместо этого метода следует использовать оператор node.data += arg.

Метод deleteData

Синтаксис:  элемент.deleteData(offset, count)
Аргументы:  offset, count — неотрицательные целые выражения
Исключения: NO_MODIFICATION_ALLOWED_ERR, INDEX_SIZE_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод deleteData удаляет фрагмент текстового содержимого узла длиной count символов, начиная с позиции offset. Если count + offset > length, то удаляется подстрока, начиная с позиции offset и до конца данных. Если offset отрицателен или больше length, либо если count отрицателен, то генерируется исключение INDEX_SIZE_ERR. Пример:

var node = document.createTextNode("12345");
node.deleteData(1, 3);
alert(node.data);

Оператор alert выведет в Gecko на экран строку 15. В Internet Explorer вместо этого метода следует использовать оператор node.data = node.data.substr(0, offset) + node.data.substr(offset+count).

Метод insertData

Синтаксис:  элемент.insertData(offset, arg)
Аргументы:  offset — неотрицательное целое выражение
            arg — выражение типа DOMString
Исключения: NO_MODIFICATION_ALLOWED_ERR, INDEX_SIZE_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод insertData вставляет строку arg в текстовое содержимое, начиная с позиции offset. Если offset отрицателен или больше length, то генерируется исключение INDEX_SIZE_ERR. Пример:

var node = document.createTextNode("12345");
node.insertData(0, "0");
alert(node.data);

Оператор alert выведет в Gecko на экран строку 012345. В Internet Explorer вместо этого метода следует использовать оператор
node.data = node.data.substr(0, offset) + arg + node.data.substr(offset).

Метод replaceData

Синтаксис:  элемент.replaceData(offset, count, arg)
Аргументы:  offset, count — неотрицательные целые выражения
            arg — выражение типа DOMString
Исключения: NO_MODIFICATION_ALLOWED_ERR, INDEX_SIZE_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод replaceData заменяет фрагмент текста длиной count символов, начиная с позиции offset, на строку arg. Если offset отрицателен или больше length, либо count отрицателен, то генерируется исключение INDEX_SIZE_ERR. Пример:

var node = document.createTextNode("12345");
node.replaceData(0, 3, "678");
alert(node.data);

Оператор alert выведет в Gecko на экран строку 67845. В Internet Explorer вместо этого метода следует использовать оператор
node.data = node.data.substr(0, offset) + arg + node.data.substr(offset+count).

Метод substringData

Синтаксис:  элемент.substringData(offset, count)
Аргументы:  offset, count — неотрицательные целые выражения
Результат:  значение типа DOMString
Исключения: DOMSTRING_SIZE_ERR, INDEX_SIZE_ERR

Поддержка:  Только для XML-документов.
            Соответствует стандарту.

Метод substringData возвращает фрагмент текстового содержимого узла длиной count символов, начиная с позиции offset. Если count + offset > length, то возвращается подстрока, начиная с позиции offset и до конца данных. Текстовое содержимое узла не изменяется. Если offset отрицателен или больше length, либо если count отрицателен, то генерируется исключение INDEX_SIZE_ERR. Пример:

var node = document.createTextNode("12345");
alert(node.substringData(1, 3));

Оператор alert выведет в Gecko на экран строку 234. В Internet Explorer вместо этого метода следует использовать оператор node.data.substr(offset, count).

4.4.4. Текстовый узел: интерфейс Text

Поддержка:  Поддерживается для XML-документов (XMLDOMText);
              для HTML-документов поддерживается частично.
            Соответствует стандарту.

Интерфейс Text реализует текстовое содержимое элементов и атрибутов. Он наследует все свойства и методы интерфейса CharacterData и имеет единственный собственный метод splitText.

Метод splitText

Синтаксис:  элемент.splitText(offset)
Аргументы:  offset — неотрицательное целое выражение
Результат:  новый узел Text
Исключения: NO_MODIFICATION_ALLOWED_ERR, INDEX_SIZE_ERR

Поддержка:  Соответствует стандарту.
            Соответствует стандарту.

Метод splitText расщепляет текстовый узел на два узла, которые являются братьями в дереве документа. Старый узел будет содержать свое исходное содержимое до позиции offset исключительно, а новый узел — исходное содержимое, начиная с позиции offset и до конца текста. Если offset отрицателен или больше length, то генерируется исключение INDEX_SIZE_ERR. Пример:

var node = document.createTextNode("0123456789");
var newnode = node.splitText(5);
alert(node.data);
alert(newnode.data);

Первый оператор alert выведет на экран строку 01234, а второй — строку 56789.

4.4.5. Комментарий: интерфейс Comment

Поддержка:  Поддерживается только для XML-документов (XMLDOMComment).
            Соответствует стандарту.

Интерфейс Comment реализует комментарии XML- и HTML-документов. Он наследует все свойства и методы интерфейса CharacterData и содержит текст комментария, т. е. все, что находится между ограничителями . Собственных свойств и методов у него нет.

HIVE: All information for read only. Please respect copyright!

Advertising: