JavaScript 加载与解析 XML 文件及字符串的方法
作者:函数茶馆时间:2026-10-24 11:50:06浏览:364
本文介绍了在 JavaScript 中加载和解析 XML 数据的方法,涵盖从外部文件加载以及解析自定义字符串两种场景。代码示例展示了如何兼容 Internet Explorer 的 ActiveXObject 与其他现代浏览器(如 Firefox、Opera)的 createDocument 接口,实现 XML 文档的异步加载与节点提取。
JavaScript 加载与解析 XML 文档的示例
JavaScript 加载与解析 XML 文档的示例
books.xml
具体代码实现如下:
<?xml version="1.0" encoding="ISO-8859-1"?>
<bookstore>
<book category="children">
<title lang="en">www.jb51.net</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="web" cover="paperback">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
<book category="web">
<title lang="en">XQuery Kick Start</title>
<author>James McGovern</author>
<author>Per Bothner</author>
<author>Kurt Cagle</author>
<author>James Linn</author>
<author>Vaidyanathan Nagarajan</author>
<year>2003</year>
<price>49.99</price>
</book>
</bookstore>loadxml.htm
相关 HTML 页面代码如下:
<html>
<head>
<script>
try //Internet Explorer
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc.
{
xmlDoc=document.implementation.createDocument("","",null);
}
catch(e) {alert(e.message)}
}
try
{
xmlDoc.async=false;
xmlDoc.load("books.xml");
document.write(xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue); }
catch(e){alert(e.message);}
</script>
</head>
<body>
</body>
</html>上述示例演示了如何加载并解析 XML 文件,而在实际开发中,XML 数据往往以自定义字符串的形式存在,这种情况通常在后台语言处理或动态生成数据时更为常见。
<html> <head> </head> <body onload="parseXML()"> <h1>W3Schools Internal Note</h1> <p><b>To:</b> <span id="to"></span> <b>From:</b> <span id="from"></span> <b>Message:</b> <span id="message"></span> </p> </body> </html> [Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
如果阅读完上述实例,可以参考以下补充文章。
https://www.jb51.net/article/14604.htm
作者最新文章
JS大数值转字符串出现科学计数法怎么办
2026-11-05 17:09:21
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数?
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑?
2026-11-05 14:01:09
