Учебники

XML DOM — Добавить узел

Декабрь 12, 2018

В этой главе мы обсудим узлы существующего элемента. Это обеспечивает средства для —

  • добавить новые дочерние узлы до или после существующих дочерних узлов

  • вставить данные в текстовом узле

  • добавить узел атрибута

добавить новые дочерние узлы до или после существующих дочерних узлов

вставить данные в текстовом узле

добавить узел атрибута

Следующие методы могут быть использованы для добавления / добавления узлов к элементу в 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 должны находиться на одном и том же пути на вашем сервере). Мы получим следующее в выводе —

52
Share: