javascript加载XML字符串或文件
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字符串或文件的更多相关文章
- js便签笔记(8)——js加载XML字符串或文件
1. 加载XML文件 方法1:ajax方式.代码如下: var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObje ...
- C# 加载xml文档文件及加载xml字符串
//创建XmlDocument对象 XmlDocument xmlDoc = new XmlDocument(); //载入xml文件名 xmlDoc.Load(filename); //如果是xml ...
- 兼容加载Xml字符串
var _loadXML = function(xmlString){ var xmlDoc=null; //支持IE浏览器 if(!window.DOMParser && windo ...
- 通过 XML HTTP 加载 XML 文件
新建一个.aspx文件 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="02-通 ...
- dom4j加载xml文件
## dom4j加载xml文件 ``` // 1. 加载xml文件 InputStream is = MyTest.class.getResourceAsStream("user.xml&q ...
- Android学习笔记_31_通过后台代码生成View对象以及动态加载XML布局文件到LinearLayout
一.布局文件part.xml: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...
- 通过JS加载XML文件,跨浏览器兼容
引言 通过JS加载XML文件,跨多种浏览器兼容. 在Chrome中,没有load方法,需要特殊处理! 解决方案 部分代码 try //Internet Explorer { xmlDoc=new Ac ...
- 解决 org.apache.ibatis.binding.BindingException: Invalid bound statement (not found) 以及MyBatis批量加载xml映射文件的方式
错误 org.apache.ibatis.binding.BindingException: Invalid bound statement (not found) 的出现,意味着项目需要xml文件来 ...
- Android 如何使用 WebView 加载 HTML 字符串和处理转译字符
Android 如何使用 WebView 加载 HTML 字符串和处理转译字符 css bug 在 WebView 中编译 Web 应用 如果您希望在客户端应用中提供 Web 应用(或只是网页),则可 ...
随机推荐
- luoguP3531 [POI2012]LIT-Letters
(https://www.luogu.org/problem/P3531) 注意编号 #include<cstdio> #include<algorithm> #include ...
- Django之ContentType,GenericRelation, GenericForeignKey
contenttypes 是Django内置的一个应用,可以追踪项目中所有app和model的对应关系,并记录在ContentType表中. models.py文件的表结构写好后,通过makemigr ...
- Token认证,如何快速方便获取用户信息
背景 我们有一个Web项目,这个项目提供了很多的Rest API.也做了权限控制,访问API的请求必须要带上事先认证后获取的Token才可以. 认证的话就在Filter中进行的,会获取请求的Token ...
- flink 注册函数示例
需求 (filter): 现在有这么一个需求,统计出现在纽约的行车记录.这里我们需要进行一个过滤的操作,我们需要有个自定义的 UDF ,具体思路是,表里面有经度和维度这两个字段,通过这个可以来开发一个 ...
- ‘Maximum call stack size exceeded’错误的解决方法
今天打开vue项目,页面空白报了一个错误,错误如下: “Maximum call stack size exceeded” 错误的字面意思是:超出最大调用堆栈大小. 然后就是各种百度,找错误原因.百度 ...
- 面试官:说说Mysql数据库分库分表,并且会有哪些问题?
之前一篇文章已经谈到了数据库集群之主从集群也就是读写分离,也提到了读写分离其实只是分担了访问的压力,但是存储的压力没有解决. 存储的压力说白了就是随着系统的演化,需求的增加,可能表的数量会逐渐增多,比 ...
- CompletableFuture2
public class CompletableFuture2 { public static void main(String[] args) throws InterruptedException ...
- Prometheus K8S中部署Alertmanager
Prometheus K8S中部署Alertmanager 设置告警和通知的主要步骤如下:一.部署Alertmanager二.配置Prometheus与Alertmanager通信三.配置告警 1. ...
- MySQL5.8下载及安装——免安装版
1.下载MySQL5.8下载地址:https://dev.mysql.com/downloads/mysql/ 图一: 图二: 2.如何安装.配置mysql-8.0.17-winx64.zip下载完成 ...
- Python TK编程第一部分 Hello Again
当你想写大一点的程序的时候,将你的代码封装到一个或者多个类里会是一个不错的办法.下面'hello world'这个例子来自Matt Conway的Tkinter Life Preserver. fro ...