Объект Узел – Методы appendChild, cloneNode, insertBefore, removeChild и replaceChild – Часть 1

Рубрика: DOM - Объектная Модель Документа

Здравствуйте, уважаемые читатели блога okITgo.ru! Очередной пост рубрики DOM посвящен подробному рассмотрению методов объекта Узел appendChild(), cloneNode(), insertBefore(), removeChild() и replaceChild(), которые позволяют модифицировать структуру XML документа, добавляя, клонируя, вставляя, удаляя и замещая узлы.

Метод appendChild()


Справочник Объекта Узел Объект Узел

Определение и Использование

Метод appendChild() прицепляет новый дочерний узел в конец списка дочерних узлов данного узла.

Этот метод возвращает новый дочерний узел (который прицепили, т.е. по сути свой параметр).

Синтаксис

appendChild(newchild)

Параметр Описание
newchild Узел, который требуется добавить (прицепить)


Пример

Следующий фрагмент кода загружает "books.xml" в xmlDoc с помощью loadXMLDoc(), создает узел (<edition>), и добавляет его за последним сыном первого узла <book>:

Пример

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

document.write(x.getElementsByTagName("edition")[0].nodeName);

Вывод:

edition

Попробуйте сами »


Попробуйте-Сами Демонстрация

appendChild() – Прицепить дочерний узел ко всем узлам <book>


Метод cloneNode()


Справочник Объекта Узел Объект Узел

Определение и Использование

Метод cloneNode() создает точную копию указанного узла.

Этот метод возвращает клонированный узел.

Синтаксис

nodeObject.cloneNode(include_all)

Параметр Описание
include_all Обязательный. Если Булев параметр установлен в true, то клонированный узел клонирует все дочерние узлы оригинального (исходного) узла


Пример

Следующий фрагмент кода загружает "books.xml" в xmlDoc посредством loadXMLDoc(), клонирует первый узел <book> и затем добавляет его в конец списка узлов:

Пример

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName(‘book’)[0];
cloneNode=x.cloneNode(true);
xmlDoc.documentElement.appendChild(cloneNode);

//Вывести все заголовки
y=xmlDoc.getElementsByTagName("title");
for (i=0;i<y.length;i++)
{
document.write(y[i].childNodes[0].nodeValue);
document.write("");
}

Вывод:

Самогон и другие спиртные напитки домашнего приготовления
Арлекино и Пьеро
Ajax в действии
Библия JavaScript 4-е Издание
Самогон и другие спиртные напитки домашнего приготовления

Попробуйте сами »


Метод insertBefore()


Справочник Объекта Узел Объект Узел

Определение и Использование

Метод insertBefore() вставляет новый дочерний элемент перед существующим дочерним элементом.

Этот метод возвращает новый дочерний элемент (т.е. передаваемый этому методу первый параметр).

Синтаксис

insertBefore(newchild,refchild)

Параметр Описание
newchild Новый дочерний элемент для вставки
refchild Узел, перед которым должен быть вставлен новый узел


Пример

Следующий фрагмент кода загружает "books.xml" в xmlDoc с помощью loadXMLDoc(), создает новый узел <book> и вставляет его перед последним узлом <book>:

Пример

xmlDoc=loadXMLDoc("books.xml");

newNode=xmlDoc.createElement("book");

x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book")[3];

x.insertBefore(newNode,y);

Попробуйте сами »


Метод removeChild()


Справочник Объекта Узел Объект Узел

Определение и Использование

Метод removeChild() удаляет дочерний узел.

Эта функция возвращает удаленный узел в случае успеха, или NULL при сбое.

Синтаксис

elementNode.removeChild(node)

Параметр Описание
node Обязательный. Указывает дочерний узел, который следует удалить

Пример

Следующий фрагмент кода загружает "books.xml" в xmlDoc, используя loadXMLDoc(), и удаляет дочерний узел в первом узле <book>:

Пример

xmlDoc=loadXMLDoc("books.xml");

y=xmlDoc.getElementsByTagName("book")[0];
x=xmlDoc.documentElement.removeChild(y);

document.write("Удаленный узел: " + x.nodeName);

Вывод:

Удаленный узел: book

Попробуйте сами »


Метод replaceChild()


Справочник Объекта Узел Объект Узел

Определение и Использование

Метод replaceChild() заменяет дочерний узел другим узлом.

Данная функция вернет замененный (новый) узел в случае успеха, или NULL при сбое.

Синтаксис

elementNode.replaceChild(new_node,old_node)

Параметр Описание
new_node Обязательный. Указывает новый узел
old_node Обязательный. Указывает дочерний узел, который надо заменить
 

Пример

Следующий фрагмент кода загружает "books.xml" в xmlDoc, применяя loadXMLDoc(), и заменяет первый узел <book>:

Пример

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.documentElement;

//создаем элемент book (книга)
newNode=xmlDoc.createElement("book");

y=xmlDoc.getElementsByTagName("book")[0]
//заменяем первый узел book новым узлом
x.replaceChild(newNode,y);

Попробуйте сами »


Справочник Объекта Узел Объект Узел

Спасибо за внимание! До новых встреч на страницах сайта okITgo.ru.