javascript解析XML【DOM】

最新推荐文章于 2024-04-19 11:50:46 发布

最新推荐文章于 2024-04-19 11:50:46 发布 · 136 阅读

文章标签：

#XML #JavaScript #Microsoft #HTML #工作 #ViewUI

JavaScript 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用DOM解析XML文件的方法，并提供了JavaScript代码示例，展示了如何加载XML文档、获取节点信息以及通过不同方式访问XML元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

DOM 是以层次结构组织的节点或信息片段的集合,这个层次允许开发人员在树中导航以寻找特定信息，分析该结构通常需要加载

整个文档和结构层次结构，然后才能做其他工作。由于她是基于信息层次的，因而DOM被认为是基于树或基于对象的

Info.xml
<?xml version='1.0' encoding='gb2312'?>
<Info>
<basic country="china">
<name num="3">霍元甲</name>
<age>42</age>
<sex>男</sex>
</basic>
<description>精武门的创始人</description>
</Info>

html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>访问XML文档</title>
<script>
function GetInfo(){
var document_xml=new ActiveXObject("Microsoft.XMLDOM");
document_xml.load("Info.xml"); //加载XML

var Rootnode=document_xml.documentElement; //获得Info.xml文档的根节点
//alert(Rootnode.attributes.getNamedItem("country").value); ?为什么这样无法查询出属性

var FirstNode=Rootnode.firstChild; //获得根记录的第一个子节点
var SecondNode=Rootnode.lastChild; //获得根节点的最后一个子节点

var nameNode=FirstNode.firstChild;
var ageNode=nameNode.nextSibling; //获得nameNode节点的下一个兄弟节点
var sexNode=FirstNode.lastChild;

var str= "\n描述是："+SecondNode.firstChild.nodeValue
+"\n姓名是："+nameNode.firstChild.nodeValue
+"\n年龄是："+ageNode.firstChild.nodeValue
+"\n性别是："+sexNode.firstChild.nodeValue;
alert(str);
}

function GetInfo2()
{
var document_xml=new ActiveXObject("Microsoft.XMLDOM");
document_xml.load("Info.xml"); //加载XML

var nameNode=document_xml.getElementsByTagName("name"); //获得文档中<name>标记
var ageNode=document_xml.getElementsByTagName("age"); //获得文档中<age>标记
var sexNode=document_xml.getElementsByTagName("sex"); //获得文档中<sex>标记
var desNode=document_xml.getElementsByTagName("description"); //获得文档中<description>标记

str="名称是："+nameNode(0).firstChild.nodeValue+
"\n年龄是："+ageNode(0).firstChild.nodeValue+
"\n性别是："+sexNode(0).firstChild.nodeValue+
"\n描述是："+desNode(0).firstChild.nodeValue;

alert(str);
}

function GetAttributes()
{
var document_xml=new ActiveXObject("Microsoft.XMLDOM");
document_xml.load("Info.xml"); //加载XML

var basicNode=document_xml.getElementsByTagName("basic"); //获得文档的所有<basic>标记
var nameNode=document_xml.getElementsByTagName("name"); //获得文档的<name>标记

var basic_attribute=basicNode(0).attributes; //获得<basic>标记的树形
var name_attribute=nameNode(0).attributes; //获得<basic>标记的树形

var str="国籍是："+basic_attribute.getNamedItem("country").value+
"\n名字中有："+name_attribute.getNamedItem("num").value+"个字"; //读出这些树形中某个特定的属性的值

alert(str);
}
</script>
</HEAD>
<BODY>
<input type="button" name="submit" value="按钮" onclick="GetInfo();"/>
</BODY>
</HTML>