什么是 XML?
- XML 指可扩展标记语言(EXtensible Markup Language)
- XML 是一种标记语言,很类似 HTML
- XML 的设计宗旨是传输数据,而非显示数据
- XML 标签没有被预定义。您需要自行定义标签。
- XML 被设计为具有自我描述性。
- XML 是 W3C 的推荐标准
XML DOM
加载并解析 XML 文件
JS代码:
var xmlhttp,xmlDoc; if(window.XMLHttpRequest){ xmlhttp = new XMLHttpRequest(); }else{ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open('get','./http.xml',false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; document.getElementById('to').innerHTML = xmlDoc.getElementsByTagName('to')[0].childNodes[0].nodeValue;
http.xml代码:
<note> <to>George</to> <from>John</from> <heading>Reminder</heading> <body>Don't forget the meeting!</body> </note>
详细了解: XMLHttpRequest 对象
加载并解析 XML 字符串
<body> <h1>W3School.com.cn Internal Note</h1> <p> <b>To:</b> <span id="to"></span><br /> <b>From:</b> <span id="from"></span><br /> <b>Message:</b> <span id="message"></span> </p> <script type="text/javascript"> var txt = ` <note> <to>George</to> <from>John</from> <heading>Reminder</heading> <body>Don't forget the meeting!</body> </note> `; <!-- 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){ parser=new DOMParser(); xmlDoc=parser.parseFromString(txt,"text/xml"); } else{ // Internet Explorer xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.loadXML(txt); } document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue; document.getElementById("from").innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue; document.getElementById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
XML to HTML
HTML代码 :
<body> <script type="text/javascript"> if(window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }else{// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","./http.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; document.write("<table border='1'>"); var x=xmlDoc.getElementsByTagName("block"); for (i=0;i<x.length;i++){ document.write("<tr><td>"); document.write(x[i].getElementsByTagName("to")[0].childNodes[0].nodeValue); document.write("</td><td>"); document.write(x[i].getElementsByTagName("from")[0].childNodes[0].nodeValue); document.write("</td></tr>"); } document.write("</table>"); </script> </body>
http.xml代码:
<note> <block> <to>George</to> <from>John</from> </block> <block> <to>China</to> <from>America</from> </block> </note>
注意:出于安全方面的原因,现代的浏览器不允许跨域的访问。假如你打算在自己的网页上使用上面的例子,则必须把 XML 文件放到自己的服务器上。否则,
xmlDoc.load()
将产生错误 "Access is denied"。
XML 命名空间(XML Namespaces)
使用前缀来避免命名冲突
此文档带有某个表格中的信息:
<h:table> <h:tr> <h:td>Apples</h:td> <h:td>Bananas</h:td> </h:tr> </h:table>
此 XML 文档携带着有关一件家具的信息:
<f:table> <f:name>African Coffee Table</f:name> <f:width>80</f:width> <f:length>120</f:length> </f:table>
现在,命名冲突不存在了,这是由于两个文档都使用了不同的名称来命名它们的<table>
元素 (<h:table> 和 <f:table>)
。
通过使用前缀,我们创建了两种不同类型的 <table>
元素。
使用命名空间(Namespaces)
这个 XML 文档携带着某个表格中的信息:
<h:table xmlns:h="http://www.w3.org/TR/html4/"> <h:tr> <h:td>Apples</h:td> <h:td>Bananas</h:td> </h:tr> </h:table>
此 XML 文档携带着有关一件家具的信息:
<f:table xmlns:f="http://www.w3school.com.cn/furniture"> <f:name>African Coffee Table</f:name> <f:width>80</f:width> <f:length>120</f:length> </f:table>
与仅仅使用前缀不同,我们为<table>
标签添加了一个xmlns
属性,这样就为前缀赋予了一个与某个命名空间相关联的限定名称。
(xmlns) 属性
XML 命名空间属性被放置于元素的开始标签之中,并使用以下的语法:
xmlns:namespace-prefix="namespaceURI"
XML CDATA
非法的 XML 字符必须被替换为实体引用
假如您在 XML 文档中放置了一个类似 "<"
字符,那么这个文档会产生一个错误,这是因为解析器会把它解释为新元素的开始。因此你不能这样写:
<message>if salary < 1000 then</message>
为了避免此类错误,需要把字符"<"
替换为实体引用,就像这样:
<message>if salary < 1000 then</message>
在 XML 中有 5 个预定义的实体引用:
< | < | 小于 |
> | > | 大于 |
& | & | 和号 |
' | ' | 省略号 |
" | " | 引号 |
注释:严格地讲,在 XML 中仅有字符 "<"和"&" 是非法的。省略号、引号和大于号是合法的,但是把它们替换为实体引用是个好的习惯。
CDATA
在 XML 元素中,"<" 和 "&" 是非法的。
"<" 会产生错误,因为解析器会把该字符解释为新元素的开始。
"&" 也会产生错误,因为解析器会把该字符解释为字符实体的开始。
某些文本,比如 JavaScript 代码,包含大量 "<" 或 "&" 字符。为了避免错误,可以将脚本代码定义为 CDATA。
CDATA 部分中的所有内容都会被解析器忽略。
CDATA 部分由 "<![CDATA[" 开始,由 "]]>" 结束:
<script> <![CDATA[ function matchwo(a,b) { if (a < b && a < 0) then { return 1; } else { return 0; } } ]]> </script>
详细参考:《XML CDATA》
详细的基础知识参考:《W3school:XML 教程》