В этой главе мы обсудим, как создавать новые узлы, используя несколько методов объекта документа. Эти методы обеспечивают область для создания нового узла элемента, текстового узла, узла комментария, узла раздела CDATA и узла атрибута . Если вновь созданный узел уже существует в объекте элемента, он заменяется новым. Следующие разделы демонстрируют это на примерах.
Создать новый элемент Элемент
Метод createElement () создает новый элементный узел. Если вновь созданный элементный узел существует в объекте элемента, он заменяется новым.
Синтаксис
Синтаксис для использования метода createElement () следующий:
var_name = xmldoc.createElement("tagname");
Куда,
-
var_name — это имя пользовательской переменной, которая содержит имя нового элемента.
-
(«tagname») — это имя нового элемента элемента, который будет создан.
var_name — это имя пользовательской переменной, которая содержит имя нового элемента.
(«tagname») — это имя нового элемента элемента, который будет создан.
пример
В следующем примере (createnewelement_example.htm) анализируется документ XML ( node.xml ) в объект XML DOM и создается новый узел элемента PhoneNo в документе XML.
<!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"); new_element = xmlDoc.createElement("PhoneNo"); x = xmlDoc.getElementsByTagName("FirstName")[0]; x.appendChild(new_element); document.write(x.getElementsByTagName("PhoneNo")[0].nodeName); </script> </body> </html>
-
new_element = xmlDoc.createElement («PhoneNo»); создает новый узел элемента <PhoneNo>
-
x.appendChild (new_element); x содержит имя указанного дочернего узла <FirstName>, к которому добавляется новый элементный узел.
new_element = xmlDoc.createElement («PhoneNo»); создает новый узел элемента <PhoneNo>
x.appendChild (new_element); x содержит имя указанного дочернего узла <FirstName>, к которому добавляется новый элементный узел.
выполнение
Сохраните этот файл как createnewelement_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). В результате мы получаем значение атрибута как PhoneNo .
Создать новый текстовый узел
Метод createTextNode () создает новый текстовый узел.
Синтаксис
Синтаксис для использования createTextNode () выглядит следующим образом —
var_name = xmldoc.createTextNode("tagname");
Куда,
-
var_name — это имя пользовательской переменной, которая содержит имя нового текстового узла.
-
(«tagname») — в скобках указано имя нового текстового узла, который будет создан.
var_name — это имя пользовательской переменной, которая содержит имя нового текстового узла.
(«tagname») — в скобках указано имя нового текстового узла, который будет создан.
пример
В следующем примере (createtextnode_example.htm) анализируется XML-документ ( node.xml ) в объект XML DOM и создается новый текстовый узел Im new text node в XML-документе.
<!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"); create_t = xmlDoc.createTextNode("Im new text node"); create_e.appendChild(create_t); x = xmlDoc.getElementsByTagName("Employee")[0]; x.appendChild(create_e); document.write(" PhoneNO: "); document.write(x.getElementsByTagName("PhoneNo")[0].childNodes[0].nodeValue); </script> </body> </html>
Подробности вышеупомянутого кода как ниже —
-
create_e = xmlDoc.createElement («PhoneNo»); создает новый элемент < PhoneNo >.
-
create_t = xmlDoc.createTextNode («Я новый текстовый узел»); создает новый текстовый узел «Im new text node» .
-
x.appendChild (create_e); текстовый узел «Новый текстовый узел» добавляется к элементу < PhoneNo >.
-
document.write (x.getElementsByTagName ( «PhoneNo») [0] .childNodes [0] .nodeValue); записывает новое значение текстового узла в элемент <PhoneNo>.
create_e = xmlDoc.createElement («PhoneNo»); создает новый элемент < PhoneNo >.
create_t = xmlDoc.createTextNode («Я новый текстовый узел»); создает новый текстовый узел «Im new text node» .
x.appendChild (create_e); текстовый узел «Новый текстовый узел» добавляется к элементу < PhoneNo >.
document.write (x.getElementsByTagName ( «PhoneNo») [0] .childNodes [0] .nodeValue); записывает новое значение текстового узла в элемент <PhoneNo>.
выполнение
Сохраните этот файл как createtextnode_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). В выводе мы получаем значение атрибута как, например, PhoneNO: Im новый текстовый узел .
Создать новый узел комментариев
Метод createComment () создает новый узел комментария. Узел комментариев включен в программу для легкого понимания функциональности кода.
Синтаксис
Синтаксис для использования createComment () выглядит следующим образом —
var_name = xmldoc.createComment("tagname");
Куда,
-
var_name — это имя пользовательской переменной, которая содержит имя нового узла комментария.
-
(«tagname») — это имя нового узла комментария, который будет создан.
var_name — это имя пользовательской переменной, которая содержит имя нового узла комментария.
(«tagname») — это имя нового узла комментария, который будет создан.
пример
В следующем примере (createcommentnode_example.htm) анализируется документ XML ( node.xml ) в объект DOM XML и создается новый узел комментария «Компания является родительским узлом» в документе XML.
<!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_comment = xmlDoc.createComment("Company is the parent node"); x = xmlDoc.getElementsByTagName("Company")[0]; x.appendChild(create_comment); document.write(x.lastChild.nodeValue); </script> </body> </html>
В приведенном выше примере —
-
create_comment = xmlDoc.createComment («Компания является родительским узлом») создает указанную строку комментария .
-
x.appendChild (create_comment) В этой строке ‘x’ содержит имя элемента <Company>, к которому добавляется строка комментария.
create_comment = xmlDoc.createComment («Компания является родительским узлом») создает указанную строку комментария .
x.appendChild (create_comment) В этой строке ‘x’ содержит имя элемента <Company>, к которому добавляется строка комментария.
выполнение
Сохраните этот файл как createcommentnode_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). В результате мы получаем значение атрибута, так как Company является родительским узлом .
Создать новый узел раздела CDATA
Метод createCDATASection () создает новый узел раздела CDATA. Если в объекте элемента существует только что созданный узел раздела CDATA, он заменяется новым.
Синтаксис
Синтаксис для использования createCDATASection () выглядит следующим образом:
var_name = xmldoc.createCDATASection("tagname");
Куда,
-
var_name — это имя пользовательской переменной, которая содержит имя нового узла раздела CDATA.
-
(«tagname») — это имя нового узла раздела CDATA, который будет создан.
var_name — это имя пользовательской переменной, которая содержит имя нового узла раздела CDATA.
(«tagname») — это имя нового узла раздела CDATA, который будет создан.
пример
В следующем примере (createcdatanode_example.htm) анализируется документ XML ( node.xml ) в объект XML DOM и создается новый узел раздела CDATA «Создать пример CDATA» в документе XML.
<!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_CDATA = xmlDoc.createCDATASection("Create CDATA Example"); x = xmlDoc.getElementsByTagName("Employee")[0]; x.appendChild(create_CDATA); document.write(x.lastChild.nodeValue); </script> </body> </html>
В приведенном выше примере —
-
create_CDATA = xmlDoc.createCDATASection («Создать пример CDATA») создает новый узел раздела CDATA, «Создать пример CDATA»
-
Здесь x.appendChild (create_CDATA) , x содержит указанный элемент <Employee> с индексом 0, к которому добавляется значение узла CDATA.
create_CDATA = xmlDoc.createCDATASection («Создать пример CDATA») создает новый узел раздела CDATA, «Создать пример CDATA»
Здесь x.appendChild (create_CDATA) , x содержит указанный элемент <Employee> с индексом 0, к которому добавляется значение узла CDATA.
выполнение
Сохраните этот файл как createcdatanode_example.htm на пути к серверу (этот файл и файл node.xml должны находиться на одном и том же пути на вашем сервере). В результате мы получаем значение атрибута как пример создания CDATA .
Создать новый Атрибут узла
Для создания нового узла атрибута используется метод setAttributeNode () . Если вновь созданный узел атрибута существует в объекте элемента, он заменяется новым.
Синтаксис
Синтаксис для использования метода createElement () следующий:
var_name = xmldoc.createAttribute("tagname");
Куда,
-
var_name — это имя пользовательской переменной, которая содержит имя нового атрибута узла.
-
(«tagname») — это имя нового атрибутивного узла, который будет создан.
var_name — это имя пользовательской переменной, которая содержит имя нового атрибута узла.
(«tagname») — это имя нового атрибутивного узла, который будет создан.
пример
В следующем примере (createattributenode_example.htm) анализируется документ XML ( node.xml ) в объект DOM XML и создается новый раздел узла атрибута в документе XML.
<!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_a = xmlDoc.createAttribute("section"); create_a.nodeValue = "A"; x = xmlDoc.getElementsByTagName("Employee"); x[0].setAttributeNode(create_a); document.write("New Attribute: "); document.write(x[0].getAttribute("section")); </script> </body> </html>
В приведенном выше примере —
create_a = xmlDoc.createAttribute («Category») создает атрибут с именем <section>.
create_a.nodeValue = «Management» создает значение «A» для атрибута <section>.
x [0] .setAttributeNode (create_a) этому значению атрибута присваивается элемент узла <Employee> с индексом 0.