XML DOM 刪除節(jié)點


removeChild() 方法刪除指定節(jié)點。

removeAttribute() 方法刪除指定屬性。



tryitimg.gif嘗試一下 - 實例

下面的實例使用 XML 文件 books.xml。
函數(shù) loadXMLDoc(),位于外部 JavaScript 中,用于加載 XML 文件。

刪除元素節(jié)點
本例使用 removeChild() 來刪除第一個 <book> 元素。

刪除當前元素節(jié)點
本例使用 parentNode 和 removeChild() 來刪除當前的 <book> 元素。

刪除文本節(jié)點
本例使用 removeChild() 來刪除第一個 <title> 元素的文本節(jié)點。

清空文本節(jié)點的文本
本例使用 nodeValue() 屬性來清空第一個 <title> 元素的文本節(jié)點。

根據(jù)名稱刪除屬性
本例使用 removeAttribute() 從第一個 <book> 元素中刪除 "category" 屬性。

根據(jù)對象刪除屬性
本例使用 removeAttributeNode() 從所有 <book> 元素中刪除所有屬性。


刪除元素節(jié)點

removeChild() 方法刪除指定的節(jié)點。

當一個節(jié)點被刪除時,其所有子節(jié)點也會被刪除。

下面的代碼片段將從載入的 xml 中刪除第一個 <book> 元素:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");

document.write("Number of book nodes: ");
document.write(xmlDoc.getElementsByTagName('book').length);
document.write("<br>");

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

document.write("Number of book nodes after removeChild(): ");
document.write(xmlDoc.getElementsByTagName('book').length);

</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 把變量 y 設置為要刪除的元素節(jié)點

  3. 通過使用 removeChild() 方法從父節(jié)點刪除元素節(jié)點


刪除自身 - 刪除當前的節(jié)點

removeChild() 方法是唯一可以刪除指定節(jié)點的方法。

當您已導航到需要刪除的節(jié)點時,就可以通過使用 parentNode 屬性和 removeChild() 方法來刪除此節(jié)點:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");

document.write("Number of book nodes before removeChild(): ");
document.write(xmlDoc.getElementsByTagName("book").length);
document.write("<br>");

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

document.write("Number of book nodes after removeChild(): ");
document.write(xmlDoc.getElementsByTagName("book").length);

</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 把變量 y 設置為要刪除的元素節(jié)點

  3. 通過使用 parentNode 屬性和 removeChild() 方法來刪除此元素節(jié)點


刪除文本節(jié)點

removeChild() 方法可用于刪除文本節(jié)點:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");


x=xmlDoc.getElementsByTagName("title")[0];

document.write("Child nodes: ");
document.write(x.childNodes.length);
document.write("<br>");

y=x.childNodes[0];
x.removeChild(y);

document.write("Child nodes: ");
document.write(x.childNodes.length);
</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 把變量 x 設置為第一個 title 元素節(jié)點

  3. 把變量 y 設置為要刪除的文本節(jié)點

  4. 通過使用 removeChild() 方法從父節(jié)點刪除元素節(jié)點

不太常用 removeChild() 從節(jié)點刪除文本??梢允褂?nodeValue 屬性代替它。請看下一段。


清空文本節(jié)點

nodeValue 屬性可用于改變或清空文本節(jié)點的值:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];

document.write("Value: " + x.nodeValue);
document.write("<br>");

x.nodeValue="";

document.write("Value: " + x.nodeValue);
</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 把變量 x 設置為第一個 title 元素的文本節(jié)點

  3. 使用 nodeValue 屬性來清空文本節(jié)點的文本

遍歷并更改所有 <title> 元素的文本節(jié)點:嘗試一下


根據(jù)名稱刪除屬性節(jié)點

removeAttribute(name) 方法用于根據(jù)名稱刪除屬性節(jié)點。

實例:removeAttribute('category')

下面的代碼片段刪除第一個 <book> 元素中的 "category" 屬性:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');

document.write(x[0].getAttribute('category'));
document.write("<br>");

x[0].removeAttribute('category');

document.write(x[0].getAttribute('category'));

</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 使用 getElementsByTagName() 來獲取 book 節(jié)點

  3. 從第一個 book 元素節(jié)點中刪除 "category" 屬性

遍歷并刪除所有 <book> 元素的 "category" 屬性:嘗試一下


根據(jù)對象刪除屬性節(jié)點

removeAttributeNode(node) 方法通過使用 node 對象作為參數(shù),來刪除屬性節(jié)點。

實例: removeAttributeNode(x)

下面的代碼片段刪除所有 <book> 元素的所有屬性:

實例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');

for (i=0;i<x.length;i++)
{
while (x[i].attributes.length>0)
  {
  attnode=x[i].attributes[0];
  old_att=x[i].removeAttributeNode(attnode);

  document.write("Removed: " + old_att.nodeName)
  document.write(": " + old_att.nodeValue)
  document.write("<br>")
  }
}
</script>
</body>
</html>

運行實例 ?

點擊 "運行實例" 按鈕查看在線實例

實例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 使用 getElementsByTagName() 來獲取所有 book 節(jié)點

  3. 檢查每個 book 元素是否擁有屬性

  4. 如果在某個 book 元素中存在屬性,則刪除該屬性