XML DOM 教學課程login
XML DOM 教學課程
作者:php.cn  更新時間:2022-04-13 15:27:56

DOM 刪除節點


XML DOM 刪除節點


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

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



tryitimg.gif 試試看 - 實例

#下面的實例使用 XML 檔案 books.xml。
函數 loadXMLDoc(),位於外部 JavaScript 中,用於載入 XML 檔案。

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

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

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

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

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

根據物件刪除屬性
本例使用 removeAttributeNode() 從所有 <book> 元素中刪除所有屬性。


刪除元素節點

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

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

下面的程式碼片段會從載入的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 設定為要刪除的元素節點

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


刪除自身- 刪除目前的節點

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

當您已導覽至需要刪除的節點時,就可以透過使用parentNode 屬性和removeChild() 方法來刪除此節點:

實例

#
<!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 設為要刪除的元素節點

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


#刪除文字節點

removeChild() 方法可用來刪除文字節點:

實例

<!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>
##執行實例»
##點擊"執行實例"按鈕查看線上實例

實例解釋:

#使用loadXMLDoc() 把"books.xml" 載入xmlDoc 中
  1. 把變數x 設定為第一個title 元素節點
  2. 把變數y 設定為要刪除的文字節點
  3. 透過使用removeChild() 方法從父節點刪除元素節點
  4. #不太常用removeChild() 從節點刪除文字。可以使用 nodeValue 屬性來代替它。請看下一段。

清除文字節點


nodeValue 屬性可用來改變或清除文字節點的值:

實例

<!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>

運行實例»

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

#實例解釋:

使用loadXMLDoc () 把"books.xml" 載入xmlDoc 中
  1. 把變數x 設定為第一個title 元素的文字節點
  2. 使用nodeValue 屬性來清空文字節點的文字
  3. 遍歷並更改所有<title> 元素的文字節點:嘗試

##根據名稱刪除屬性節點

removeAttribute(
name

) 方法用於根據名稱刪除屬性節點。

實例: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>