Методы объекта Element

Метод Описание
getAttribute(имя_атрибута) Возвращает значение атрибута
setAttribute(имя_атрибута, значение) Устанавливает значение атрибута
removeAttribute(имя_атрибута) Устанавливает значение атрибута по умолчанию, затирая текущее значение

Ниже приведен пример на задание атрибутов.

<html><head><title>Пример динамического создания HTML-документа</title>
</head>
<body>
<script language = "JavaScript">
var newText;
var newElem;
newText = document.createTextNode("Пример динамического
создания HTML-документа");
newElem = document.createElement("H1");
newElem.appendChild(newText);
newElem.setAttribute("align", "center");
document.body.appendChild(newElem);
alert(newElem.getAttribute("align"));
newText = document.createTextNode("Абзац");
newElem = document.createElement("P");
newElem.appendChild(newText);
newElem.setAttribute("align", "right");
document.body.appendChild(newElem);
alert(newElem.getAttribute("align"));
newElem.removeAttribute("align");
</script></body></html>

Технику создания новых элементов обсудим на конкретном примере. Мы хотим добавить к нашему списку элемент <LI>XML</LI>. Этому HTML-элементу в DOM соответствуют два узла: узел-элемент <LI> и текстовый узел "XML". Следовательно, мы должны создать два новых узла. Новые узлы создаются с помощью методов createElement() и createTextNode() объекта document.

Метод createElement()

Метод createElement() принимает в качестве параметра строку с названием тэга элемента и создает новый HTML элемент указанного типа. Например, строка кода var oItem = document.createElement("LI") создаёт новый элемент списка <LI>, у которого нет содержания. Метод возвращает ссылку на созданный им объект. Созданный выше элемент <LI> находится в памяти, но не входит в состав текущего документа. Для того, чтобы он стал частью документа, его надо добавить к существующим узлам документа с помощью методов insertBefore() или appendChild(), которые подробно описаны ниже.

Хотя название тэга элемента можно набирать как заглавными, так и прописными буквами, рекомендуется использовать ЗАГЛАВНЫЕ БУКВЫ.

Заметим, что в IE5 можно создавать через сценарий все элементы, кроме FRAME, IFRAME и SELECT. Свойства создаваемых элементов являются свойствами для чтения и записи.

Метод createTextNode()

Метод createTextNode() используется для создания текстового узла. Он принимает в качестве параметра строку текста, которая задает значение свойства nodeValue текстового узла. Например, строка кода var oText = document.createTextNode("XML") создаёт новый текстовый узел "XML". Метод возвращает ссылку на созданный им объект. Созданный текст еще не входит в состав текущего документа. Для того, чтобы он стал частью документа, его надо присоединить к существующим узлам документа с помощью методов appendChild(), replaceNode() или insertBefore(), которые подробно описаны ниже.

Если у вас случайно завалялась ссылка на ненужный текстовый узел (например, oText), то можно не создавать нового узла, а воспользоваться уже существующим. Для этого надо просто присвоить новый текст в качестве значения свойства nodeValue существующего узла:

oText.nodeValue= "XML"

Итак, мы создали два новых узла: узел-элемент <LI> и текстовый узел "XML". Теперь займёмся встраиванием этих узлов в документ.

pBot('--???--');pTop('24.08.2006') Узлы разного типа (document, элементы, атрибуты и текст) имеют свой набор свойств и методов, которые позволяют через сценарии манипулировать ими. Ключевые свойства и методы узлов описаны в этой статье. Ряд узлов-элементов (объектов) имеют свои собственные свойства и методы. Так, например, объект элемента TABLE имеет метод createTHead();. Полный набор рекомендованных свойств и методов можно найти в документации W3C. Надо отметить, что IE поддерживает гораздо более широкий набор, чем содержится в рекомендации W3C.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: