XML 基础介绍

最新推荐文章于 2023-08-05 21:17:01 发布

Lyrelion

最新推荐文章于 2023-08-05 21:17:01 发布

阅读量2.1k

点赞数

分类专栏： XML/JSON 文章标签： XML

本文链接：https://blog.csdn.net/Lyrelion/article/details/123458934

版权

XML/JSON 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

4.2 把 XML 文档解析到 XML DOM 对象中

4.3 把 XML 字符串解析到 XML DOM 对象中

1. XML 简介

XML 是独立于软件和硬件的信息传输工具

XML(EXtensible Markup Language) 用来传输和存储数据
HTML(HyperText Markup Language) 用来格式化并显示数据

2. XML 语法

XML 文档形成一种树结构（文档树），这棵树从根部开始，并扩展到树的最底端

XML 文档必须包含根元素，该元素是所有其他元素的父元素

XML第一行放声明文件，包含：XML 版本，编码格式（UTF-8 也是 HTML5, CSS, JavaScript, PHP, 和 SQL 的默认编码）

<?xml version="1.0" encoding="utf-8"?>

XML 元素必须有关闭标签

<p>This is a paragraph.</p>
<br />

XML 标签对大小写敏感

<Message> 这是错误的 </message>

XML 属性值必须加引号（单、双引号都行），但是尽量避免使用属性；属性可以用来存储 id 之类的非数据本身的东西，也就是说，属性可以用来存储元数据（数据的 id 等）

<note id="12"></note>

XML标签内，应该使用实体引用；举个栗子：把字符 "<" 放在 XML 元素中，会发生错误，这是因为解析器会把它当作新元素的开始

<message>if salary < 1000 then</message>

<	<	less than
>	>	greater than
&	&	ampersand
'	'	apostrophe
"	"	quotation mark

XML 会保留空格，HTML会合并多个空格

XML 以 LF 存储换行；在 Windows 应用程序中，换行通常以一对字符来存储：回车符（CR）和换行符（LF）；在 Unix 和 Mac OSX 中，使用 LF 来存储新行；在旧的 Mac 系统中，使用 CR 来存储新行；

XML 标签命名规则：可以使用数字、“_”、字母等组合，尽量不要使用 “-”

3. XML 样式

3.1 查看 XML 文件

大多数的浏览器都会仅仅把 XML 文档显示为源代码

没有发生错误的、不做任何样式处理的 XML 文件：

内部语法错误的 XML 文件：

3.2 使用 CSS 格式化 XML

<?xml-stylesheet type="text/css" href="test.css"?>

效果展示：

3.3 使用 XSLT 格式化 XML

相比 CSS，W3C 推荐使用 XSLT(eXtensible Stylesheet Language Transformations) 格式化 XML

原理：XSLT 是在浏览器显示 XML 文件之前，先把它转换为 HTML，再进行展示

一般情况下，当浏览器读取 XML 文件时，XSLT 转换是由浏览器完成的，不同的浏览器可能会产生不同结果；为了减少这种问题，可以在服务器上进行 XSLT 转换

4. XML 和 JavaScript

4.1 XML 解析器和 XML DOM

XML 解析器（XML Parser）：可以把 XML 文档转换为 XML DOM 对象，进而可以使用 JavaScript 对 XML 进行操作，所有现代浏览器都有内建的 XML 解析器

XML DOM（XML Document Object Model）定义了访问和操作 XML 文档的标准方法，它把 XML 文档作为树结构来查看

4.2 把 XML 文档解析到 XML DOM 对象中

<!-- note.xml 文件 -->
<note>
  <to>Lyrelion</to>
  <from>Dog</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>

<!-- html 文件 -->
<html>
  <body>
    <h1>把 XML 文档 解析到 XML DOM 对象中</h1>
    <div>
      <b>To:</b> <span id="to"></span><br />
      <b>From:</b> <span id="from"></span><br />
      <b>Message:</b> <span id="message"></span>
    </div>

    <script>
      // 把 XML 文档 解析到 XML DOM 对象中
      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", "note.xml", false);
      xmlhttp.send();
      xmlDoc = xmlhttp.responseXML;

      // 使用 XML DOM 填充 HTML DOM 
      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;
    </script>
  </body>
</html>

4.3 把 XML 字符串解析到 XML DOM 对象中

Internet Explorer 使用 loadXML() 方法来解析 XML 字符串
其他浏览器使用 DOMParser 对象来解析 XML 字符串

<html>
  <body>
    <h1>把 XML 字符串 解析到 XML DOM 对象中</h1>
    <div>
      <b>To:</b> <span id="to"></span><br />
      <b>From:</b> <span id="from"></span><br />
      <b>Message:</b> <span id="message"></span>
    </div>

    <script>
      // 强烈建议 xml 字符串里别放 body 标签，很容易报错
      // Uncaught SyntaxError: Invalid or unexpected token
      var txt =
        "<note>
           <to>Lyrelion</to>
           <from>DOG</from>
           <heading>Reminder</heading>
           <message>Don't forget me this weekend!</message>
         </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("message")[0].childNodes[0].nodeValue;
    </script>
  </body>
</html>

5. XML 进阶

5.1 XML 命名空间

当两个不同的文档使用相同的元素名时，就会发生命名冲突

举个栗子：我在一个 html 文件中，引入了两个 xml 文件，这两个 xml 文件都包括 table 标签，那么 html 文件就无法正常解析这两个 xml 文件

XML 命名空间提供：避免元素命名冲突的方法

命名空间的声明语法：xmlns:前缀="URI"

命名空间被定义在：元素的开始标签中的示例

<root>
  <!-- 命名空间被定义在：元素的开始标签中 -->
  <h:table xmlns:h="http://www.w3.org/TR/html4/">
    <h:tr>
      <h:td>Apples</h:td>
    </h:tr>
  </h:table>

  <!-- 命名空间被定义在：元素的开始标签中 -->
  <f:table xmlns:f="http://www.w3cschool.cc/furniture">
    <f:name>African Coffee Table</f:name>
  </f:table>
</root>

命名空间被定义在：XML 根元素中的示例

<!-- 命名空间被定义在：XML 根元素中 -->
<root xmlns:h="http://www.w3.org/TR/html4/"
  xmlns:f="http://www.w3cschool.cc/furniture">
  <h:table>
    <h:tr>
      <h:td>Apples</h:td>
    </h:tr>
  </h:table>
  <f:table>
    <f:name>African Coffee Table</f:name>
  </f:table>
</root>

为元素定义默认命名空间，可以省去前缀

<!-- 为元素定义默认的命名空间，可以省去前缀 -->
<table xmlns="http://www.w3.org/TR/html4/">
  <tr>
    <td>Apples</td>
  </tr>
</table>
<table xmlns="http://www.w3schools.com/furniture">
  <name>African Coffee Table</name>
</table>

5.2 XML CDATA

某些文本，比如 JavaScript 代码，包含大量 "<" 或 "&" 字符。为了避免错误，可以将脚本代码定义为 CDATA，CDATA 部分中的所有内容，都会被解析器忽略

PCDATA - 解析的字符数据
CDATA - 未解析的字符数据

CDATA 部分由 "<![CDATA[" 开始，由 "]]>" 结束

<script>
  <![CDATA[
    function matchwo(a,b) {
      if (a < b && a < 0) {
        return 1;
      } else {
        return 0;
      }
    }
  ]]>
</script>

注意：

CDATA 部分不能包含字符串 "]]>"。也不允许嵌套的 CDATA 部分
标记 CDATA 部分结尾的 "]]>" 不能包含空格或换行

5.3 XML DOM 操作

获取元素的值：txt = xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

获取属性的值：txt = xmlDoc.getElementsByTagName("title")[0].getAttribute("lang");

创建一个新的元素节点：createElement()

创建一个新的文本节点：createTextNode()

向节点添加子节点（在最后一个子节点之后）：appendChild()

删除节点：removeChild()

<!-- 创建一个 <edition> 元素 -->
var newel = xmlDoc.createElement("edition"); 

<!-- 创建值为 "First" 的文本节点 -->
var newtext = xmlDoc.createTextNode("First"); 

<!-- 把这个文本节点追加到新的 <edition> 元素 -->
newel.appendChild(newtext); 

<!-- 把 <edition> 元素追加到第一个 <book> 元素 -->
x = xmlDoc.getElementsByTagName("book");
x[0].appendChild(newel);

6. 总结与展望

6.1 XML 基础介绍梳理

XML 可用于交换、共享和存储数据

XML 有非常简单的语法规则。带有正确语法的 XML 是"形式良好"的。有效的 XML 是针对 DTD 进行验证的

XSLT 用于把 XML 转换为其他格式，比如 HTML

所有现代的浏览器有一个内建的 XML 解析器，可读取和操作 XML

DOM（Document Object Model）定义了一个访问 XML 的标准方式

XMLHttpRequest 对象提供了一个网页加载后与服务器进行通信的方式

XML 命名空间提供了一种避免元素命名冲突的方法

CDATA 区域内的文本会被解析器忽略

6.2 XML 相关技术清单

XHTML (可扩展 HTML) 更严格更纯净的基于 XML 的 HTML 版本

XML DOM (XML 文档对象模型) 访问和操作 XML 的标准文档模型

XSL (可扩展样式表语言) XSL 包含三个部分：

XSLT (XSL 转换) - 把 XML 转换为其他格式，比如 HTML
XSL-FO (XSL 格式化对象)- 用于格式化 XML 文档的语言
XPath - 用于导航 XML 文档的语言

XQuery (XML 查询语言) 基于 XML 的用于查询 XML 数据的语言

DTD (文档类型定义) 用于定义 XML 文档中的合法元素的标准

XSD (XML 架构) 基于 XML 的 DTD 替代物

XLink (XML 链接语言) 在 XML 文档中创建超级链接的语言

XPointer (XML 指针语言) 允许 XLink 超级链接指向 XML 文档中更多具体的部分

SOAP (简单对象访问协议) 允许应用程序在 HTTP 之上交换信息的基于 XML 的协议

WSDL (Web 服务描述语言) 用于描述网络服务的基于 XML 的语言

RDF (资源描述框架) 用于描述网络资源的基于 XML 的语言

RSS (真正简易聚合) 聚合新闻以及类新闻站点内容的格式

SVG (可伸缩矢量图形) 定义 XML 格式的图形

6.3 下一步计划

推荐学习 XML DOM 和 XSLT

XML DOM（Document Object Model）：定义了一种访问和处理 XML 文档的标准方式，XML DOM 是平台和语言独立的，可用于任何编程语言，如 Java、JavaScript 和 VBScript
XSLT（XML 样式表语言转换）：XSLT 是 XML 文件的样式表语言，通过使用 XSLT，可以把 XML 文档转换为其他格式，比如 XHTML

如果想要学习有关验证 XML 的知识，推荐学习 DTD 和 XML Schema

XML DTD（文档类型定义）：DTD 的目的是定义 XML 文档中合法的元素、属性和实体；通过使用 DTD，每个 XML 文件可以随身携带它自己的格式的描述；DTD 可以被用来确认收到的数据和自己的数据是否有效
XML Schema：XML Schema 是一种基于 XML 的 DTD 替代；不像 DTD，XML Schema 支持数据类型，且使用 XML 语法