JS解析XML的实现代码_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
JS解析XML的实现代码
上传于||暂无简介
阅读已结束，如果下载本文需要使用2下载券
想免费下载本文？
定制HR最喜欢的简历
下载文档到电脑，查找使用更方便
还剩2页未读，继续阅读
定制HR最喜欢的简历
你可能喜欢javascript中加载并解析XML字符串/xml文件-js教程-网页制作-壹聚教程网javascript中加载并解析XML字符串/xml文件
本文章来详细介绍一下关于javascript中加载并解析XML字符串/xml文件实现程序代码
首先,我们需要加载这个xml文件,js中加载xml文件,是通过XMLDOM来进行的.
&?xml version=&1.0& encoding=&utf-8& ?&
&DongFang&
& &Company&
&&& &cNname&1&/cNname&
&&& &cIP&1&/cIP&
& &/Company&
& &Company&
&&& &cNname&2&/cNname&
&&& &cIP&2&/cIP&
& &/Company&&&&
& &Company&
&&& &cNname&3&/cNname&
&&& &cIP&3&/cIP&
& &/Company&
& &Company&
&&& &cNname&4&/cNname&
&&& &cIP&4&/cIP&
& &/Company&
& &Company&
&&& &cNname&5&/cNname&
&&& &cIP&5&/cIP&
& &/Company&
& &Company&
&&& &cNname&6&/cNname&
&&& &cIP&6&/cIP&
& &/Company&
&/DongFang&
&script type='text/javascript'&
&&& loadXML = function(xmlString){
&&&&&&& var xmlDoc=
&&&&&&& //判断浏览器的类型
&&&&&&& //支持IE浏览器
&&&&&&& if(!window.DOMParser && window.ActiveXObject){&& //window.DOMParser 判断是否是非ie浏览器
&&&&&&&&&&& var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
&&&&&&&&&&& for(var i=0;i&xmlDomVersions.i++){
&&&&&&&&&&&&&&& try{
&&&&&&&&&&&&&&&&&&& xmlDoc = new ActiveXObject(xmlDomVersions[i]);
&&&&&&&&&&&&&&&&&&& xmlDoc.async =
&&&&&&&&&&&&&&&&&&& xmlDoc.loadXML(xmlString); //loadXML方法载入xml字符串
&&&&&&&&&&&&&&&&&&&
&&&&&&&&&&&&&&& }catch(e){
&&&&&&&&&&&&&&& }
&&&&&&&&&&& }
&&&&&&& //支持Mozilla浏览器
&&&&&&& else if(window.DOMParser && document.implementation && document.implementation.createDocument){
&&&&&&&&&&& try{
&&&&&&&&&&&&&&& /* DOMParser 对象解析 XML 文本并返回一个 XML Document 对象。
&&&&&&&&&&&&&&&& * 要使用 DOMParser，使用不带参数的构造函数来实例化它，然后调用其 parseFromString() 方法
&&&&&&&&&&&&&&&& * parseFromString(text, contentType) 参数text:要解析的 XML 标记 参数contentType文本的内容类型
&&&&&&&&&&&&&&&& * 可能是 &text/xml& 、&application/xml& 或 &application/xhtml+xml& 中的一个。注意，不支持 &text/html&。
&&&&&&&&&&&&&&&& */
&&&&&&&&&&&&&&& domParser = new& DOMParser();
&&&&&&&&&&&&&&& xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
&&&&&&&&&&& }catch(e){
&&&&&&&&&&& }
&&&&&&& else{
&&&&&&&&&&&
&&&&&&& return xmlD
&var xmldoc=loadXML(text.xml)
&var elements = xmlDoc.getElementsByTagName(&Company&);
&for (var i = 0; i & elements. i++) {
&&&&&&&&&&&&&&& var name = elements[i].getElementsByTagName(&cNname&)[0].firstChild.nodeV
&&&&&&&&&&&&&&& var ip = elements[i].getElementsByTagName(&cIP&)[0].firstChild.nodeV&&&&&&&&&&&&&&&
&script type=&text/javascript&&
function parseXML()
text=&&note&&;
text=text+&&to&George&/to&&;
text=text+&&from&John&/from&&;
text=text+&&heading&Reminder&/heading&&;
text=text+&&body&Don't forget the meeting!&/body&&;
text=text+&&/note&&;
try //Internet Explorer
xmlDoc=new ActiveXObject(&Microsoft.XMLDOM&);
xmlDoc.async=&false&;
xmlDoc.loadXML(text);
try //Firefox, Mozilla, Opera, etc.
parser=new DOMParser();
xmlDoc=parser.parseFromString(text,&text/xml&);
alert(e.message);
document.getElementById(&to&).innerHTML=xmlDoc.getElementsByTagName(&to&)[0].childNodes[0].nodeV
document.getElementById(&from&).innerHTML=xmlDoc.getElementsByTagName(&from&)[0].childNodes[0].nodeV
document.getElementById(&message&).innerHTML=xmlDoc.getElementsByTagName(&body&)[0].childNodes[0].nodeV
&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&
友情提示如果是解析xml文档我们不能用上面的方法，
&script type='text/javascript'&
&&& loadXML = function(xmlFile){
&&&&&&& var xmlDoc=
&&&&&&& //判断浏览器的类型
&&&&&&& //支持IE浏览器
&&&&&&& if(!window.DOMParser && window.ActiveXObject){
&&&&&&&&&&& var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
&&&&&&&&&&& for(var i=0;i&xmlDomVersions.i++){
&&&&&&&&&&&&&&& try{
&&&&&&&&&&&&&&&&&&& xmlDoc = new ActiveXObject(xmlDomVersions[i]);
&&&&&&&&&&&&&&&&&&&
&&&&&&&&&&&&&&& }catch(e){
&&&&&&&&&&&&&&& }
&&&&&&&&&&& }
&&&&&&& //支持Mozilla浏览器
&&&&&&& else if(document.implementation && document.implementation.createDocument){
&&&&&&&&&&& try{
&&&&&&&&&&&&&&& /* document.implementation.createDocument('','',null); 方法的三个参数说明
&&&&&&&&&&&&&&&& * 第一个参数是包含文档所使用的命名空间URI的字符串；
&&&&&&&&&&&&&&&& * 第二个参数是包含文档根元素名称的字符串；
&&&&&&&&&&&&&&&& * 第三个参数是要创建的文档类型（也称为doctype）
&&&&&&&&&&&&&&&& */
&&&&&&&&&&&&&&& xmlDoc = document.implementation.createDocument('','',null);
&&&&&&&&&&& }catch(e){
&&&&&&&&&&& }
&&&&&&& else{
&&&&&&&&&&&
&&&&&&& if(xmlDoc!=null){
&&&&&&&&&&& xmlDoc.async =
&&&&&&&&&&& xmlDoc.load(xmlFile);
&&&&&&& return xmlD
可以通过xmlDoc.documentElement.childNodes(1)..childNodes(0).getAttribute('Text')进行访问.
一些常用方法:
xmlDoc.documentElement.childNodes(0).nodeName,可以得到这个节点的名称.
xmlDoc.documentElement.childNodes(0).nodeValue,可以得到这个节点的值. 这个值是来自于这样子的xml格式:&a&b&/b&, 于是可以得到b这个值.
xmlDoc.documentElement.childNodes(0).hasChild,可以判断是否有子节点
根据我的经验,最好是使用getElementsByTagName(xPath)的方法对节点进行访问,因为这样子可以直接通过xPath来定位节点,这样子会有更好的性能.
上一页： &&&&&下一页：相关内容介绍与XML有关一些JavaScript工具，比如XML解析等
&xmlObjectifier&基于jQuery开发，能够把XML DOM转换成 JSON的JavaScript library。&&&
&&相关经验 ->
&&相关文档 ->
&&相关资讯 ->
&&相关代码 ->JS解析xml文件
&!DOCTYPE html&
&&title&js_city.html&/title&
&&meta http-equiv=&keywords& content=&keyword1,keyword2,keyword3&&
&&meta http-equiv=&description& content=&this is my page&&
&&meta http-equiv=&content-type& content=&text/ charset=UTF-8&&
&&!--&link rel=&stylesheet& type=&text/css& href=&./styles.css&&--&
&&script type=&text/javascript& src=&./js/js_xml.js&&&/script&
&&div align=&center&&
&&select id=&province&&&/select&
&&select id=&city&&&/select&
&?xml version=&1.0& encoding=&UTF-8&?&
&&province name=&北京市&&
&&city&海淀区&/city&
&&city&朝阳区&/city&
&&city&大兴区&/city&
&&city&昌平区&/city&
&&/province&
&&province name=&天津市&&
&&city&北辰区&/city&
&&city&和平区&/city&
&&city&虹桥区&/city&
&&city&AA区&/city&
&&/province&
&&province name=&上海市&&
&&city&BB区&/city&
&&city&CC区&/city&
&&city&DD区&/city&
&&city&MM区&/city&
&&/province&
&!DOCTYPE html&
& title&js_select.html&/title&
& meta http-equiv=&keywords& content=&keyword1,keyword2,keyword3&&
& meta http-equiv=&description& content=&this is my page&&
& meta http-equiv=&content-type& content=&text/ charset=UTF-8&&
& !--&link rel=&stylesheet& type=&text/css& href=&./styles.css&&--&
&script type=&text/javascript&&
window.onload = function() {
// 采用数组来存放 js原生格式，二级联动
var provinces = [ {
id : '1',
name : '北京',
city : [ '海淀区', '朝阳区', '大兴区' ]
id : '2',
name : '天津',
city : [ '北辰区', '和平区', '虹桥区' ]
id : '3',
name : '上海',
city : [ 'A区', 'B区', 'C区' ]
id : '4',
name : '重庆',
city : [ 'WW区', 'EE区', 'TT区' ]
// 页面加载时，显示省份
var domProvinces = document.getElementById(&province&);
// 遍历省份集合
for ( var i = 0; i & provinces. i++) {
// 获取具体省份对象
var pro = provinces[i];
// 创建元素节点
var option = document.createElement(&option&);
option.setAttribute(&value&, pro.id); //为option添加value属性
var textNode = document.createTextNode(pro.name); //创建文本节点
option.appendChild(textNode);
domProvinces.appendChild(option);
//当省份发生变化时，把相应的市区显示给用户
var domcity = document.getElementById(&city&);
domProvinces.onchange = function() {
//清除数据
domcity.length = 1;
for ( var i = 0; i & provinces. i++) {
//获取具体省份对象
var dpro = provinces[i];
if (this.value == dpro.id) {
var city = dpro.
for ( var j = 0; j & city. j++) {//创建元素节点
var doption = document.createElement(&option&);
//创建文本节点
var dtextNode = document.createTextNode(city[j]);
doption.appendChild(dtextNode);
//把创建的option节点添加到id=city的select中
domcity.appendChild(doption);
& /script&
&select id=&province&&
&option value=&-1&&请选择省份&/option&
&select id=&city&&
&option value=&-1&&请选择市区&/option&
(window.slotbydup=window.slotbydup || []).push({
id: '2467140',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467141',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467142',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467143',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467148',
container: s,
size: '1000,90',
display: 'inlay-fix'JS解析XML文件和XML字符串
JS解析XML文件
&script&type='text/javascript'&
&&&&loadXML&=&function(xmlFile){
&&&&&&&&var&xmlDoc=null;
&&&&&&&&//判断浏览器的类型
&&&&&&&&//支持IE浏览器
&&&&&&&&if(!window.DOMParser&&&&window.ActiveXObject){
&&&&&&&&&&&&var&xmlDomVersions&=&['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
&&&&&&&&&&&&for(var&i=0;i&xmlDomVersions.i++){
&&&&&&&&&&&&&&&&try{
&&&&&&&&&&&&&&&&&&&&xmlDoc&=&new&ActiveXObject(xmlDomVersions[i]);
&&&&&&&&&&&&&&&&&&&&break;
&&&&&&&&&&&&&&&&}catch(e){
&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&}
&&&&&&&&//支持Mozilla浏览器
&&&&&&&&else&if(document.implementation&&&&document.implementation.createDocument){
&&&&&&&&&&&&try{
&&&&&&&&&&&&&&&&/*&document.implementation.createDocument('','',null);&方法的三个参数说明
&&&&&&&&&&&&&&&&&*&第一个参数是包含文档所使用的命名空间URI的字符串；&
&&&&&&&&&&&&&&&&&*&第二个参数是包含文档根元素名称的字符串；&
&&&&&&&&&&&&&&&&&*&第三个参数是要创建的文档类型（也称为doctype）
&&&&&&&&&&&&&&&&&*/
&&&&&&&&&&&&&&&&xmlDoc&=&document.implementation.createDocument('','',null);
&&&&&&&&&&&&}catch(e){
&&&&&&&&&&&&}
&&&&&&&&else{
&&&&&&&&&&&&return&null;
&&&&&&&&if(xmlDoc!=null){
&&&&&&&&&&&&xmlDoc.async&=&false;
&&&&&&&&&&&&xmlDoc.load(xmlFile);
&&&&&&&&return&xmlD
JS解析XML字符串
&script&type='text/javascript'&
&&&&loadXML&=&function(xmlString){
&&&&&&&&var&xmlDoc=null;
&&&&&&&&//判断浏览器的类型
&&&&&&&&//支持IE浏览器&
&&&&&&&&if(!window.DOMParser&&&&window.ActiveXObject){&&&//window.DOMParser&判断是否是非ie浏览器
&&&&&&&&&&&&var&xmlDomVersions&=&['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
&&&&&&&&&&&&for(var&i=0;i&xmlDomVersions.i++){
&&&&&&&&&&&&&&&&try{
&&&&&&&&&&&&&&&&&&&&xmlDoc&=&new&ActiveXObject(xmlDomVersions[i]);
&&&&&&&&&&&&&&&&&&&&xmlDoc.async&=&false;
&&&&&&&&&&&&&&&&&&&&xmlDoc.loadXML(xmlString);&//loadXML方法载入xml字符串
&&&&&&&&&&&&&&&&&&&&break;
&&&&&&&&&&&&&&&&}catch(e){
&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&}
&&&&&&&&//支持Mozilla浏览器
&&&&&&&&else&if(window.DOMParser&&&&document.implementation&&&&document.implementation.createDocument){
&&&&&&&&&&&&try{
&&&&&&&&&&&&&&&&/*&DOMParser&对象解析&XML&文本并返回一个&XML&Document&对象。
&&&&&&&&&&&&&&&&&*&要使用&DOMParser，使用不带参数的构造函数来实例化它，然后调用其&parseFromString()&方法
&&&&&&&&&&&&&&&&&*&parseFromString(text,&contentType)&参数text:要解析的&XML&标记&参数contentType文本的内容类型
&&&&&&&&&&&&&&&&&*&可能是&&text/xml&&、&application/xml&&或&&application/xhtml+xml&&中的一个。注意，不支持&&text/html&。
&&&&&&&&&&&&&&&&&*/
&&&&&&&&&&&&&&&&domParser&=&new&&DOMParser();
&&&&&&&&&&&&&&&&xmlDoc&=&domParser.parseFromString(xmlString,&'text/xml');
&&&&&&&&&&&&}catch(e){
&&&&&&&&&&&&}
&&&&&&&&else{
&&&&&&&&&&&&return&null;
&&&&&&&&return&xmlD
&?xml&version=&1.0&&encoding=&utf-8&&?&
&DongFang&
&&&Company&
&&&&&cNname&1&/cNname&
&&&&&cIP&1&/cIP&
&&&/Company&
&&&Company&
&&&&&cNname&2&/cNname&
&&&&&cIP&2&/cIP&
&&&/Company&&&&&
&&&Company&
&&&&&cNname&3&/cNname&
&&&&&cIP&3&/cIP&
&&&/Company&
&&&Company&
&&&&&cNname&4&/cNname&
&&&&&cIP&4&/cIP&
&&&/Company&
&&&Company&
&&&&&cNname&5&/cNname&
&&&&&cIP&5&/cIP&
&&&/Company&
&&&Company&
&&&&&cNname&6&/cNname&
&&&&&cIP&6&/cIP&
&&&/Company&
&/DongFang&
&var xmldoc=loadXML(text.xml)
&var elements = xmlDoc.getElementsByTagName(&Company&);
&for (var i = 0; i & elements. i++) {
&&&&&&&&&&&&&&& var&name = elements[i].getElementsByTagName(&cNname&)[0].firstChild.nodeV
&&&&&&&&&&&&&&& var ip&= elements[i].getElementsByTagName(&cIP&)[0].firstChild.nodeV&&&&&&&&&&&&&&&
var e = elements[i];
for(var j in e){
console.log(j+& : &+e[j]);
childElementCount &: &0
lastElementChild &: &null
firstElementChild &: &null
children &: &[object HTMLCollection]
nextElementSibling &: &null
previousElementSibling &: &null
onwebkitfullscreenerror &: &null
onwebkitfullscreenchange &: &null
onwheel &: &null
onselectstart &: &null
onsearch &: &null
onpaste &: &null
oncut &: &null
oncopy &: &null
onbeforepaste &: &null
onbeforecut &: &null
onbeforecopy &: &null
shadowRoot &: &null
dataset &: &[object DOMStringMap]
classList &: &
className &: &
outerHTML &: &&a&1234&/a&
scrollHeight &: &0
scrollWidth &: &0
scrollTop &: &0
scrollLeft &: &0
clientHeight &: &0
clientWidth &: &0
clientTop &: &0
clientLeft &: &0
offsetParent &: &null
offsetHeight &: &0
offsetWidth &: &0
offsetTop &: &0
offsetLeft &: &0
localName &: &a
prefix &: &null
namespaceURI &: &null
style &: &null
attributes &: &[object NamedNodeMap]
tagName &: &a
parentElement &: &null
textContent &: &1234
nodeType &: &1
nodeValue &: &null
nodeName &: &a
innerHTML &: &1234
getAttribute &: &function getAttribute() { [native code] }
setAttribute &: &function setAttribute() { [native code] }
removeAttribute &: &function removeAttribute() { [native code] }
getAttributeNode &: &function getAttributeNode() { [native code] }
setAttributeNode &: &function setAttributeNode() { [native code] }
removeAttributeNode &: &function removeAttributeNode() { [native code] }
getElementsByTagName &: &function getElementsByTagName() { [native code] }
hasAttributes &: &function hasAttributes() { [native code] }
getAttributeNS &: &function getAttributeNS() { [native code] }
setAttributeNS &: &function setAttributeNS() { [native code] }
removeAttributeNS &: &function removeAttributeNS() { [native code] }
getElementsByTagNameNS &: &function getElementsByTagNameNS() { [native code] }
getAttributeNodeNS &: &function getAttributeNodeNS() { [native code] }
setAttributeNodeNS &: &function setAttributeNodeNS() { [native code] }
hasAttribute &: &function hasAttribute() { [native code] }
hasAttributeNS &: &function hasAttributeNS() { [native code] }
matches &: &function matches() { [native code] }
closest &: &function closest() { [native code] }
focus &: &function focus() { [native code] }
blur &: &function blur() { [native code] }
scrollIntoView &: &function scrollIntoView() { [native code] }
scrollIntoViewIfNeeded &: &function scrollIntoViewIfNeeded() { [native code] }
getElementsByClassName &: &function getElementsByClassName() { [native code] }
insertAdjacentElement &: &function insertAdjacentElement() { [native code] }
insertAdjacentText &: &function insertAdjacentText() { [native code] }
insertAdjacentHTML &: &function insertAdjacentHTML() { [native code] }
webkitMatchesSelector &: &function webkitMatchesSelector() { [native code] }
createShadowRoot &: &function createShadowRoot() { [native code] }
getDestinationInsertionPoints &: &function getDestinationInsertionPoints() { [native code] }
getClientRects &: &function getClientRects() { [native code] }
getBoundingClientRect &: &function getBoundingClientRect() { [native code] }
requestPointerLock &: &function requestPointerLock() { [native code] }
animate &: &function animate() { [native code] }
remove &: &function remove() { [native code] }
webkitRequestFullScreen &: &function webkitRequestFullScreen() { [native code] }
webkitRequestFullscreen &: &function webkitRequestFullscreen() { [native code] }
querySelector &: &function querySelector() { [native code] }
querySelectorAll &: &function querySelectorAll() { [native code] }
parentNode &: &[object XMLDocument]
childNodes &: &[object NodeList]
firstChild &: &[object Text]
lastChild &: &[object Text]
previousSibling &: &null
nextSibling &: &null
ownerDocument &: &[object XMLDocument]
baseURI &: &
insertBefore &: &function insertBefore() { [native code] }
replaceChild &: &function replaceChild() { [native code] }
removeChild &: &function removeChild() { [native code] }
appendChild &: &function appendChild() { [native code] }
hasChildNodes &: &function hasChildNodes() { [native code] }
cloneNode &: &function cloneNode() { [native code] }
normalize &: &function normalize() { [native code] }
isSameNode &: &function isSameNode() { [native code] }
isEqualNode &: &function isEqualNode() { [native code] }
lookupPrefix &: &function lookupPrefix() { [native code] }
isDefaultNamespace &: &function isDefaultNamespace() { [native code] }
lookupNamespaceURI &: &function lookupNamespaceURI() { [native code] }
compareDocumentPosition &: &function compareDocumentPosition() { [native code] }
contains &: &function contains() { [native code] }
ELEMENT_NODE &: &1
ATTRIBUTE_NODE &: &2
TEXT_NODE &: &3
CDATA_SECTION_NODE &: &4
ENTITY_REFERENCE_NODE &: &5
ENTITY_NODE &: &6
PROCESSING_INSTRUCTION_NODE &: &7
COMMENT_NODE &: &8
DOCUMENT_NODE &: &9
DOCUMENT_TYPE_NODE &: &10
DOCUMENT_FRAGMENT_NODE &: &11
NOTATION_NODE &: &12
DOCUMENT_POSITION_DISCONNECTED &: &1
DOCUMENT_POSITION_PRECEDING &: &2
DOCUMENT_POSITION_FOLLOWING &: &4
DOCUMENT_POSITION_CONTAINS &: &8
DOCUMENT_POSITION_CONTAINED_BY &: &16
DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC &: &32
addEventListener &: &function addEventListener() { [native code] }
removeEventListener &: &function removeEventListener() { [native code] }
dispatchEvent &: &function dispatchEvent() { [native code] }
看过本文的人也看了：
我要留言技术领域：
收藏提示你已经自动关注本知识库了哦！
取消收藏确定要取消收藏吗？
删除图谱提示你保存在该图谱下的知识内容也会被删除，建议你先将内容移到其他图谱中。你确定要删除知识图谱及其内容吗？
删除节点提示无法删除该知识节点，因该节点下仍保存有相关知识内容！
删除节点提示你确定要删除该知识节点吗？