XML DOM 删除节点
XML DOM 删除节点
removeChild() 方法删除指定节点。
removeAttribute() 方法删除指定属性。
实例
下面的例子使用 XML 文件 books.xml。
函数 loadXMLDoc(),位于外部 JavaScript 中,用于加载 XML 文件。
完整实例【删除元素节点】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
//检查最后一个节点是否是元素节点
function get_lastchild(n)
{
var x=n.lastChild;
while (x.nodeType!=1)
{
x=x.previousSibling;
}
return x;
}
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
document.write("book 节点的数目:");
document.write(xmlDoc.getElementsByTagName('book').length);
document.write("<br />");
var lastNode=get_lastchild(xmlDoc.documentElement);
var delNode=xmlDoc.documentElement.removeChild(lastNode);
document.write("removeChild() 方法执行后 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName('book').length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 removeChild() 来删除第一个 <book> 元素。
完整实例【删除当前元素节点】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
document.write("removeChild() 方法执行前 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName("book").length);
document.write("<br />");
x=xmlDoc.getElementsByTagName("book")[0]
x.parentNode.removeChild(x);
document.write("removeChild() 方法执行后 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName("book").length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 parentNode 和 removeChild() 来删除当前的 <book> 元素。
完整实例【删除文本节点】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
document.write("子节点:");
document.write(x.childNodes.length);
document.write("<br />");
y=x.childNodes[0];
x.removeChild(y);
document.write("子节点:");
document.write(x.childNodes.length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 removeChild() 来删除第一个 <title> 元素的文本节点。
完整实例【清空文本节点的文本】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
document.write("值:" + x.nodeValue);
document.write("<br />");
x.nodeValue="";
document.write("值:" + x.nodeValue);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 nodeValue() 属性来清空第一个 <title> 元素的文本节点。
完整实例【根据名称删除属性】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/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>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 removeAttribute() 从第一个 <book> 元素中删除 "category" 属性。
完整实例【根据对象删除属性】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/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("被删除的:" + old_att.nodeName)
document.write(": " + old_att.nodeValue)
document.write("<br />")
}
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
本例使用 removeAttributeNode() 删除 <book> 元素中的所有属性。
删除元素节点
removeChild() 方法删除指定的节点。
当一个节点被删除时,其所有子节点也会被删除。
下面的代码片段将从载入的 xml 中删除第一个 <book> 元素:
xmlDoc=loadXMLDoc("books.xml");
y=xmlDoc.getElementsByTagName("book")[0];
xmlDoc.documentElement.removeChild(y);
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 把变量 y 设置为要删除的元素节点
- 通过使用 removeChild() 方法从父节点删除元素节点
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
//检查最后一个节点是否是元素节点
function get_lastchild(n)
{
var x=n.lastChild;
while (x.nodeType!=1)
{
x=x.previousSibling;
}
return x;
}
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
document.write("book 节点的数目:");
document.write(xmlDoc.getElementsByTagName('book').length);
document.write("<br />");
var lastNode=get_lastchild(xmlDoc.documentElement);
var delNode=xmlDoc.documentElement.removeChild(lastNode);
document.write("removeChild() 方法执行后 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName('book').length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
删除自身 - 删除当前的节点
removeChild() 方法是唯一可以删除指定节点的方法。
当你已定位需要删除的节点时,就可以通过使用 parentNode 属性和 removeChild() 方法来删除此节点:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0];
x.parentNode.removeChild(x);
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 把变量 y 设置为要删除的元素节点
- 通过使用 parentNode 属性和 removeChild() 方法来删除此元素节点
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
document.write("removeChild() 方法执行前 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName("book").length);
document.write("<br />");
x=xmlDoc.getElementsByTagName("book")[0]
x.parentNode.removeChild(x);
document.write("removeChild() 方法执行后 book 节点的数目:");
document.write(xmlDoc.getElementsByTagName("book").length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
删除文本节点
removeChild() 方法可用于删除文本节点:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
y=x.childNodes[0];
x.removeChild(y);
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 把变量 x 设置为第一个 title 元素节点
- 把变量 y 设置为 要删除的文本节点
- 通过使用 removeChild() 方法从父节点删除节点
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
document.write("子节点:");
document.write(x.childNodes.length);
document.write("<br />");
y=x.childNodes[0];
x.removeChild(y);
document.write("子节点:");
document.write(x.childNodes.length);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
不太常用 removeChild() 从节点删除文本。可以使用 nodeValue 属性代替它。请看下一段。
清空文本节点
nodeValue 属性可用于改变或清空文本节点的值:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.nodeValue="";
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 把变量 x 设置为第一个 title 元素的文本节点
- 使用 nodeValue 属性来清空文本节点的文本
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
document.write("值:" + x.nodeValue);
document.write("<br />");
x.nodeValue="";
document.write("值:" + x.nodeValue);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
循环并更改所有 <title> 元素的文本节点:TIY
根据名称删除属性节点
removeAttribute(name) 方法用于根据名称删除属性节点。
Example: removeAttribute('category')
下面的代码片段删除第一个 <book> 元素中的 "category" 属性:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book");
x[0].removeAttribute("category");
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 使用 getElementsByTagName() 来获取 book 节点
- 从第一个 book 元素节点中删除 "category" 属性
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/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>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
遍历并删除所有 <book> 元素的 "category" 属性:TIY。
根据对象删除属性节点
removeAttributeNode(node) 方法通过使用 Node 对象作为参数,来删除属性节点。
Example: removeAttributeNode(x)
下面的代码片段删除所有 <book> 元素的所有属性:
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);
}
}
例子解释:
- 通过使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
- 使用 getElementsByTagName() 来获取所有 book 节点
- 检查每个 book 元素是否拥有属性
- 如果在某个 book 元素中存在属性,则删除该属性
完整实例【TIY】:
<html>
<head>
<script type="text/javascript" src="/demo/example/xdom/loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("/demo/example/xdom/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("被删除的:" + old_att.nodeName)
document.write(": " + old_att.nodeValue)
document.write("<br />")
}
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html