1. 加载XML文件

方法1:ajax方式。代码如下:

var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr.open("GET", "data.xml", false);
xhr.send(null);
var xmlDoc = xhr.responseXML;
console.log(xmlDoc);

(关于XMLHttpRequest对象的用法,请参加 http://www.w3school.com.cn/xmldom/dom_http.asp

注意,代码第二行的“false”,表示不用异步。如果这里改为“true”,那么xmlDoc将得到null。因为js的异步操作,不会等待文件加载完,就直接执行下面的语句了。所以,我们这里必须设置为“false”,表示必须等待文件加载完,再执行以下操作,这样才能得到正确的xmlDoc。

这种方式兼容所有高级浏览器,建议采用这种方式加载。

方法2:IE的方式。代码如下:

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.load("note.xml");
console.log(xmlDoc); 

通过IE特有的ActiveXObject("Microsoft.XMLDOM")对象的load()方法加载文件。

注意,这里还是设置了异步是false,原因和方法1的一样。

方法3:Firefox的方式,代码如下:

var xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.async = "false";
xmlDoc.load("note.xml");
console.log(xmlDoc);

关于跨域加载:安全起见,现代浏览器不能跨域访问,即只能加载本机上的xml文件。

2. 加载XML字符串

先看代码:

       function LoadXmlText() {

             //拼接XML字符串
var txt = '';
txt = txt + "<note>";
txt = txt + "<to>George</to>";
txt = txt + "<from>John</from>";
txt = txt + "<heading>Reminder</heading>";
txt = txt + "<body>Don't forget the meeting!</body>";
txt = txt + "</note>"; if (window.DOMParser) {
//非IE浏览器
xmlDoc = (new DOMParser()).parseFromString(txt, "text/xml");
} else {
//IE浏览器
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
// 或者:xmlDoc = new ActiveXObject("MSXML2.DOMDocument"); xmlDoc.async = "false"; //不启用异步,保证加载文件成功之前不会进行下面操作
xmlDoc.loadXML(txt);
} console.log(xmlDoc);
}

如果浏览器支持window.DOMParser对象,则直接用它的parseFromString()方法加载xml字符串。

IE浏览器不支持window.DOMParser,则用loadXML()加载。

代码中注释都写的很亲你清楚。

出处:https://www.cnblogs.com/wangfupeng1988/p/3709924.html

============================================================================

我根据上面的说明,也写个符合自己是一的吧

    // 加载xml文档
function loadXmlFile(xmlFile) {
var xmlDoc = null;
if (window.ActiveXObject) {
xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = false;
xmlDoc.load(xmlFile);
}
else if (document.implementation && document.implementation.createDocument) {
xmlDoc = document.implementation.createDocument('', 'doc', null);
xmlDoc.async = false;
xmlDoc.preserveWhiteSpace = true;
xmlDoc.load(xmlFile);
}
else if (window.XMLHttpRequest) {//支持出网络获取
var xmlhttp = new window.XMLHttpRequest();
xmlhttp.open("GET", "#", false);
xmlhttp.send(null);
xmlDoc = xmlhttp.responseXML.documentElement;
}
return xmlDoc;
}
//加载xml字符串
function loadXmlStr(xmlStr) {
var xmlDoc = null;
if (window.DOMParser) {
//非IE浏览器
xmlDoc = (new DOMParser()).parseFromString(xmlStr, "text/xml");
}
else {
//IE浏览器
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
// 或者:xmlDoc = new ActiveXObject("MSXML2.DOMDocument");
xmlDoc.async = "false"; //不启用异步,保证加载文件成功之前不会进行下面操作
xmlDoc.loadXML(xmlStr);
}
return xmlDoc;
}

参考:https://www.jb51.net/article/76019.htm

========================================================

既然做到了这里,就不得不说的是操作xml,其实就是dom的操作,那么就可能会用到nodeName 、nodeType、 nodeValue 这些属性

NodeTypes

文档、元素、属性以及 HTML 或 XML 文档的其他方面拥有不同的节点类型。

存在 12 种不同的节点类型,其中可能会有不同节点类型的子节点:

节点类型 描述 子节点
1 Element 代表元素 Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference
2 Attr 代表属性 Text, EntityReference
3 Text 代表元素或属性中的文本内容。 None
4 CDATASection 代表文档中的 CDATA 部分(不会由解析器解析的文本)。 None
5 EntityReference 代表实体引用。 Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
6 Entity 代表实体。 Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
7 ProcessingInstruction 代表处理指令。 None
8 Comment 代表注释。 None
9 Document 代表整个文档(DOM 树的根节点)。 Element, ProcessingInstruction, Comment, DocumentType
10 DocumentType 向为文档定义的实体提供接口 None
11 DocumentFragment 代表轻量级的 Document 对象,能够容纳文档的某个部分 Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
12 Notation 代表 DTD 中声明的符号。 None

节点类型 - 返回值

对于每种节点类型,nodeName 和 nodeValue 属性的返回值:

节点类型 nodeName 返回 nodeValue 返回
1 Element 元素名 null
2 Attr 属性名称 属性值
3 Text #text 节点的内容
4 CDATASection #cdata-section 节点的内容
5 EntityReference 实体引用名称 null
6 Entity 实体名称 null
7 ProcessingInstruction target 节点的内容
8 Comment #comment 注释文本
9 Document #document null
10 DocumentType 文档类型名称 null
11 DocumentFragment #document 片段 null
12 Notation 符号名称 null

NodeTypes - Named Constants

NodeType Named Constant
1 ELEMENT_NODE
2 ATTRIBUTE_NODE
3 TEXT_NODE
4 CDATA_SECTION_NODE
5 ENTITY_REFERENCE_NODE
6 ENTITY_NODE
7 PROCESSING_INSTRUCTION_NODE
8 COMMENT_NODE
9 DOCUMENT_NODE
10 DOCUMENT_TYPE_NODE
11 DOCUMENT_FRAGMENT_NODE
12 NOTATION_NODE

参考:https://www.w3school.com.cn/jsref/prop_node_nodetype.asp

javascript加载XML字符串或文件的更多相关文章

  1. js便签笔记(8)——js加载XML字符串或文件

    1. 加载XML文件 方法1:ajax方式.代码如下: var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObje ...

  2. C# 加载xml文档文件及加载xml字符串

    //创建XmlDocument对象 XmlDocument xmlDoc = new XmlDocument(); //载入xml文件名 xmlDoc.Load(filename); //如果是xml ...

  3. 兼容加载Xml字符串

    var _loadXML = function(xmlString){ var xmlDoc=null; //支持IE浏览器 if(!window.DOMParser && windo ...

  4. 通过 XML HTTP 加载 XML 文件

    新建一个.aspx文件 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="02-通 ...

  5. dom4j加载xml文件

    ## dom4j加载xml文件 ``` // 1. 加载xml文件 InputStream is = MyTest.class.getResourceAsStream("user.xml&q ...

  6. Android学习笔记_31_通过后台代码生成View对象以及动态加载XML布局文件到LinearLayout

    一.布局文件part.xml: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...

  7. 通过JS加载XML文件,跨浏览器兼容

    引言 通过JS加载XML文件,跨多种浏览器兼容. 在Chrome中,没有load方法,需要特殊处理! 解决方案 部分代码 try //Internet Explorer { xmlDoc=new Ac ...

  8. 解决 org.apache.ibatis.binding.BindingException: Invalid bound statement (not found) 以及MyBatis批量加载xml映射文件的方式

    错误 org.apache.ibatis.binding.BindingException: Invalid bound statement (not found) 的出现,意味着项目需要xml文件来 ...

  9. Android 如何使用 WebView 加载 HTML 字符串和处理转译字符

    Android 如何使用 WebView 加载 HTML 字符串和处理转译字符 css bug 在 WebView 中编译 Web 应用 如果您希望在客户端应用中提供 Web 应用(或只是网页),则可 ...

随机推荐

  1. C++中的异常处理(上)

    C++内置了异常处理的语法元素try... catch ...-try语句处理正常代码逻辑-catch语句处理异常情况-try语句中的异常由对应的catch语句处理 try { ,); } catch ...

  2. Codeforces Round #604 (Div. 2) 练习A,B题解

    A题 链接 思路分析: 因为只需要做到相邻的不相同,利用三个不同的字母是肯定可以实现的, 所以直接先将所有的问号进行替换,比如比前一个大1,如果与后面的冲突,则再加一 代码(写的很烂): #inclu ...

  3. Java:String,int相互转化

    int转String int a: a + “”    String.valueOf(a)    Interger.toString(a)    一般使用以上几种方法进行转化 第一种方法效率不好,ja ...

  4. SpringBoot(十八)_springboot打成war包部署

    最近在做项目的时候,由于使用的是springboot,需要打成war包.我就按照正常的思路去打包,结果部署后无法访问,一直报错404.后续问了问 公司同事,他给解决了.说大部分都是这个原因. 如果需要 ...

  5. Special-Judge模板

    SPJ模板 放一篇\(SPJ\)(\(Special-Judge\))的模板. 注意,仅适用于\(Lemon\). 并不适用于洛谷. 代码:@zcs0724 #include <bits/std ...

  6. 【洛谷3515】[POI2011] Lightning Conductor(决策单调性)

    点此看题面 大致题意: 给你一个序列,对于每个\(i\)求最小的自然数\(p\)使得对于任意\(j\)满足\(a_j\le a_i+p-\sqrt{|i-j|}\). 证明单调性 考虑到\(\sqrt ...

  7. HTML连载17-id选择器&类选择器

    一.问题:我们前面讲了标签选择器有一个缺陷就是它不加选择的把所有相同的标签全都变成统一样式,这对于我们个性化定制产生了阻碍,因此我们便引出了id选择器,来进行特别指定进行配置样式 二.id选择器 1. ...

  8. PHP rand和mt_rand 区别

    mt_rand() 比rand() 快四倍使用方法 <?php//输出35echo(mt_rand(10,100));?>

  9. Appium swipe实现屏幕滑动

    在 Appium 中提供 swipe() 方法来模拟用户滑动屏幕. swipe() 实现过程 是先通过在屏幕上标记两个坐标,然后再从开始坐标移动到结束坐标. 先看下 swipe 方法定义: def s ...

  10. Vue.js 源码分析(十五) 指令篇 v-bind指令详解

    指令是Vue.js模板中最常用的一项功能,它带有前缀v-,比如上面说的v-if.v-html.v-pre等.指令的主要职责就是当其表达式的值改变时,相应的将某些行为应用到DOM上,先介绍v-bind指 ...