JQuery解析HTML、JSON和XML实例详解

2. JSON解析

2.1. 解析简单的JSON数据

2.1.1. 代码示例

// JSON对象
{
  "name": "Tom",
  "age": 22,
  "birthday": "1999-01-01"
}

// JQuery代码
var jsonData = '{ "name": "Tom", "age": 22, "birthday": "1999-01-01" }';
var json = $.parseJSON(jsonData);

2.1.2. 解析结果

{
  "name": "Tom",
  "age": 22,
  "birthday": "1999-01-01"
}

2.1.3. 解析过程

使用JQuery中的$.parseJSON()方法，可以将JSON格式的字符串转换为JSON对象。在上面的示例中，我们定义了一个JSON格式的字符串，并将其传给$.parseJSON()方法，然后将返回的JSON对象存入变量json中，最终得到一个包含三个属性（name、age、birthday）的JSON对象。

2.2. 解析复杂的JSON数据

2.2.1. 代码示例

// JSON对象
{
  "name": "Tom",
  "age": 22,
  "contact": {
    "email": "tom@example.com",
    "phone": "123-456-7890"
  },
  "hobbies": [
    "reading",
    "travel"
  ]
}

// JQuery代码
var jsonData = '{ "name": "Tom", "age": 22, "contact": { "email": "tom@example.com", "phone": "123-456-7890" }, "hobbies": ["reading", "travel"] }';
var json = $.parseJSON(jsonData);

2.2.2. 解析结果

{
  "name": "Tom",
  "age": 22,
  "contact": {
    "email": "tom@example.com",
    "phone": "123-456-7890"
  },
  "hobbies": [
    "reading",
    "travel"
  ]
}

2.2.3. 解析过程

使用$.parseJSON()方法解析复杂的JSON数据时，需要确保JSON数据的格式符合JSON规范。在上面的示例中，我们定义了一个包含多个属性，其中contact属性是一个嵌套的JSON对象，hobbies属性是一个由多个字符串元素组成的JSON数组。将JSON格式的字符串传给$.parseJSON()方法后，它返回一个对应的JSON对象。

3. XML解析

3.1. 解析简单的XML数据

3.1.1. 代码示例

<!-- XML文本 -->
<bookstore>
  <book category="web">
    <title lang="en">Everyday JavaScript</title>
    <author>John Doe</author>
    <year>2019</year>
    <price>19.99</price>
  </book>
</bookstore>

// JQuery代码
var xml = $.parseXML(xmlText);
var $xml = $(xml);
var bookTitle = $xml.find('title').text();

3.1.2. 解析结果

Everyday JavaScript

3.1.3. 解析过程

使用JQuery中的$.parseXML()方法，可以将XML格式的字符串转换为XML文档对象。然后使用$(xml)将XML文档对象封装成JQuery对象，最后可以使用JQuery选择器获取XML文档中的元素。在上面的示例中，我们获取了XML文档中的