В этой главе мы обсудим узлы существующего элемента. Это обеспечивает средства для —
-
добавить новые дочерние узлы до или после существующих дочерних узлов
-
вставить данные в текстовом узле
-
добавить узел атрибута
добавить новые дочерние узлы до или после существующих дочерних узлов
вставить данные в текстовом узле
добавить узел атрибута
Следующие методы могут быть использованы для добавления / добавления узлов к элементу в DOM —
- AppendChild ()
- InsertBefore ()
- insertData ()
AppendChild ()
Метод appendChild () добавляет новый дочерний узел после существующего дочернего узла.
Синтаксис
Синтаксис метода appendChild () выглядит следующим образом:
Node appendChild(Node newChild) throws DOMException
Куда,
-
newChild — это узел для добавления
-
Этот метод возвращает добавленный узел .
newChild — это узел для добавления
Этот метод возвращает добавленный узел .
пример
В следующем примере (appendchildnode_example.htm) анализируется XML-документ ( node.xml ) в объект XML DOM и добавляется новый дочерний PhoneNo к элементу <FirstName>.
<!DOCTYPE html> <html> <head> <script> function loadXMLDoc(filename) { if (window.XMLHttpRequest) { xhttp = new XMLHttpRequest(); } else // code for IE5 and IE6 { xhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET",filename,false); xhttp.send(); return xhttp.responseXML; } </script> </head> <body> <script> xmlDoc = loadXMLDoc("/dom/node.xml"); create_e = xmlDoc.createElement("PhoneNo"); x = xmlDoc.getElementsByTagName("FirstName")[0]; x.appendChild(create_e); document.write(x.getElementsByTagName("PhoneNo")[0].nodeName); </script> </body> </html>
В приведенном выше примере —
-
используя метод createElement (), создается новый элемент PhoneNo .
-
Новый элемент PhoneNo добавляется в элемент FirstName с помощью метода appendChild ().
используя метод createElement (), создается новый элемент PhoneNo .
Новый элемент PhoneNo добавляется в элемент FirstName с помощью метода appendChild ().
выполнение
Сохраните этот файл как appendchildnode_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). В результате мы получаем значение атрибута как PhoneNo .
InsertBefore ()
Метод insertBefore () вставляет новые дочерние узлы перед указанными дочерними узлами.
Синтаксис
Синтаксис метода insertBefore () следующий:
Node insertBefore(Node newChild, Node refChild) throws DOMException
Куда,
-
newChild — это узел для вставки
-
refChild — Ссылочный узел, т. е. узел, перед которым должен быть вставлен новый узел.
-
Этот метод возвращает вставляемый узел .
newChild — это узел для вставки
refChild — Ссылочный узел, т. е. узел, перед которым должен быть вставлен новый узел.
Этот метод возвращает вставляемый узел .
пример
В следующем примере (insertnodebefore_example.htm) анализируется XML-документ ( node.xml ) в объект XML DOM и вставляется новый дочерний Email перед указанным элементом <Email>.
<!DOCTYPE html> <html> <head> <script> function loadXMLDoc(filename) { if (window.XMLHttpRequest) { xhttp = new XMLHttpRequest(); } else // code for IE5 and IE6 { xhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET",filename,false); xhttp.send(); return xhttp.responseXML; } </script> </head> <body> <script> xmlDoc = loadXMLDoc("/dom/node.xml"); create_e = xmlDoc.createElement("Email"); x = xmlDoc.documentElement; y = xmlDoc.getElementsByTagName("Email"); document.write("No of Email elements before inserting was: " + y.length); document.write("<br>"); x.insertBefore(create_e,y[3]); y=xmlDoc.getElementsByTagName("Email"); document.write("No of Email elements after inserting is: " + y.length); </script> </body> </html>
В приведенном выше примере —
-
используя метод createElement (), создается новый элемент Email .
-
Новый элемент Email добавляется перед элементом Email с помощью метода insertBefore ().
-
y.length дает общее количество элементов, добавленных до и после нового элемента.
используя метод createElement (), создается новый элемент Email .
Новый элемент Email добавляется перед элементом Email с помощью метода insertBefore ().
y.length дает общее количество элементов, добавленных до и после нового элемента.
выполнение
Сохраните этот файл как insertnodebefore_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). Мы получим следующий вывод —
No of Email elements before inserting was: 3 No of Email elements after inserting is: 4
insertData ()
Метод insertData () вставляет строку с указанным 16-разрядным смещением.
Синтаксис
InsertData () имеет следующий синтаксис —
void insertData(int offset, java.lang.String arg) throws DOMException
Куда,
-
смещение — это смещение символа для вставки.
-
arg — это ключевое слово для вставки данных. Он включает в себя два параметра offset и string в скобках, разделенных запятой.
смещение — это смещение символа для вставки.
arg — это ключевое слово для вставки данных. Он включает в себя два параметра offset и string в скобках, разделенных запятой.
пример
В следующем примере (addtext_example.htm) выполняется синтаксический анализ XML-документа (» node.xml «) в объект XML DOM и вставка новых данных MiddleName в указанной позиции в элемент <FirstName>.
<!DOCTYPE html> <html> <head> <script> function loadXMLDoc(filename) { if (window.XMLHttpRequest) { xhttp = new XMLHttpRequest(); } else // code for IE5 and IE6 { xhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET",filename,false); xhttp.send(); return xhttp.responseXML; } </script> </head> <body> <script> xmlDoc = loadXMLDoc("/dom/node.xml"); x = xmlDoc.getElementsByTagName("FirstName")[0].childNodes[0]; document.write(x.nodeValue); x.insertData(6,"MiddleName"); document.write("<br>"); document.write(x.nodeValue); </script> </body> </html>
-
x.insertData (6, «MiddleName»); — Здесь x содержит имя указанного дочернего имени, то есть <FirstName>. Затем мы вставляем в этот текстовый узел данные «MiddleName», начиная с позиции 6.
x.insertData (6, «MiddleName»); — Здесь x содержит имя указанного дочернего имени, то есть <FirstName>. Затем мы вставляем в этот текстовый узел данные «MiddleName», начиная с позиции 6.
выполнение
Сохраните этот файл как addtext_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). Мы получим следующее в выводе —