XML DOM 創建節點 · W3School Xml 教程

# XML DOM 創建節點 ## 嘗試一下 - 實例下面的實例使用 XML 文件 [books.xml](images/books.xml)。函數 [loadXMLDoc()](dom-loadxmldoc.html)，位于外部 JavaScript 中，用于加載 XML 文件。 [創建元素節點](/try/try.php?filename=try_dom_createelement1) 本例使用 createElement() 來創建一個新的元素節點，并使用 appendChild() 把它添加到一個節點中。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); newtext=xmlDoc.createTextNode("first"); newel.appendChild(newtext); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); //Output title and edition document.write(x.getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write(" - Edition: "); document.write(x.getElementsByTagName("edition")[0].childNodes[0].nodeValue); </script> </body> </html> ``` [使用 createAttribute 創建屬性節點](/try/try.php?filename=try_dom_createattribute) 本例使用 createAttribute() 來創建一個新的屬性節點，并使用 setAttributeNode() 把它插入一個元素中。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newatt=xmlDoc.createAttribute("edition"); newatt.nodeValue="first"; x=xmlDoc.getElementsByTagName("title"); x[0].setAttributeNode(newatt); document.write("Edition: "); document.write(x[0].getAttribute("edition")); </script> </body> </html> ``` [使用 setAttribute 創建屬性節點](/try/try.php?filename=try_dom_createattribute3) 本例使用 setAttribute() 為一個元素創建一個新的屬性。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title"); x[0].setAttribute("edition","first"); document.write("Edition: "); document.write(x[0].getAttribute("edition")); </script> </body> </html> ``` [創建文本節點](/try/try.php?filename=try_dom_createelement1) 本例使用 createTextNode() 來創建一個新的文本節點，并使用 appendChild() 把它添加到一個元素中。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); newtext=xmlDoc.createTextNode("first"); newel.appendChild(newtext); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); //Output title and edition document.write(x.getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write(" - Edition: "); document.write(x.getElementsByTagName("edition")[0].childNodes[0].nodeValue); </script> </body> </html> ``` [創建 CDATA section 節點](/try/try.php?filename=try_dom_createcdatasection1) 本例使用 createCDATAsection() 來創建一個 CDATA section 節點，并使用 appendChild() 把它添加到一個元素中。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"></script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newCDATA); document.write(x.lastChild.nodeValue); </script> </body> </html> ``` [創建注釋節點](/try/try.php?filename=try_dom_createcomment1) 本例使用 createComment() 來創建一個注釋節點，并使用 appendChild() 把它添加到一個元素中。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"></script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newComment=xmlDoc.createComment("Revised April 2008"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newComment); document.write(x.lastChild.nodeValue); </script> </body> </html> ``` ## 創建新的元素節點 createElement() 方法創建一個新的元素節點： ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 創建一個新的元素節點 <edition> 3. 向第一個 <book> 元素追加這個元素節點遍歷并向所有 <book> 元素添加一個元素： [嘗試一下](/try/try.php?filename=try_dom_createelement) ## 創建新的屬性節點 createAttribute() 用于創建一個新的屬性節點： ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); newatt=xmlDoc.createAttribute("edition"); newatt.nodeValue="first"; x=xmlDoc.getElementsByTagName("title"); x[0].setAttributeNode(newatt); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 創建一個新的屬性節點 "edition" 3. 設置屬性節點的值為 "first" 4. 向第一個 <title> 元素添加這個新的屬性節點遍歷所有的 <title> 元素，并添加一個新的屬性節點： [嘗試一下](/try/try.php?filename=try_dom_createattribute2) **注意：**如果該屬性已存在，則被新屬性替代。 ## 使用 setAttribute() 創建屬性由于 setAttribute() 方法可以在屬性不存在的情況下創建新的屬性，我們可以使用這個方法來創建一個新的屬性。 ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName('book'); x[0].setAttribute("edition","first"); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 為第一個 <book> 元素設置（創建）值為 "first" 的 "edition" 屬性遍歷所有的 <title> 元素并添加一個新屬性： [嘗試一下](/try/try.php?filename=try_dom_createattribute4) ## 創建文本節點 createTextNode() 方法創建一個新的文本節點： ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); newtext=xmlDoc.createTextNode("first"); newel.appendChild(newtext); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 創建一個新元素節點 <edition> 3. 創建一個新的文本節點，其文本是 "first" 4. 向這個元素節點追加新的文本節點 5. 向第一個 <book> 元素追加新的元素節點向所有的 <book> 元素添加一個帶有文本節點的元素節點： [嘗試一下](/try/try.php?filename=try_dom_createelement) ## 創建 CDATA Section 節點 createCDATASection() 方法創建一個新的 CDATA section 節點。 ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newCDATA); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 創建一個新的 CDATA section 節點 3. 向第一個 <book> 元素追加這個新的 CDATA section 節點遍歷并向所有 <book> 元素添加一個 CDATA section： [嘗試一下](/try/try.php?filename=try_dom_createcdatasection) ## 創建注釋節點 createComment() 方法創建一個新的注釋節點。 ## 實例 ``` xmlDoc=loadXMLDoc("books.xml"); newComment=xmlDoc.createComment("Revised March 2008"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newComment); ``` 實例解釋： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 載入 xmlDoc 中 2. 創建一個新的注釋節點 3. 把這個新的注釋節點追加到第一個 <book> 元素循環并向所有 <book> 元素添加一個注釋節點： [嘗試一下](/try/try.php?filename=try_dom_createcomment)