|
AJAX JSON 解析与数据解析
zbhj5bwxftpxlry.png
(图片来源网络,侵删)
简介
AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。
AJAX请求
创建AJAX对象
var xhr = new XMLHttpRequest();
初始化请求
xhr.open('GET', 'https://api.example.com/data', true);
发送请求
xhr.send();
JSON解析
JSON解析是将JSON字符串转换为JavaScript对象的过程,可以使用JSON.parse()方法进行解析。
示例
假设服务器返回的JSON数据如下:
{
"name": "张三",
"age": 30,
"email": "zhangsan@example.com"
}
可以使用以下代码将JSON字符串解析为JavaScript对象:
var jsonString = '{"name":"张三","age":30,"email":"zhangsan@example.com"}';
var jsonObject = JSON.parse(jsonString);
现在,jsonObject是一个包含解析后的JSON数据的JavaScript对象,可以通过访问其属性来获取数据:
console.log(jsonObject.name); // 输出:张三
console.log(jsonObject.age); // 输出:30
console.log(jsonObject.email); // 输出:zhangsan@example.com
AJAX JSON解析
当使用AJAX获取JSON数据时,需要在onreadystatechange事件中处理响应,当readyState变为4且status为200时,表示请求成功完成,此时可以解析响应文本并将其转换为JavaScript对象。
示例
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var jsonString = xhr.responseText;
var jsonObject = JSON.parse(jsonString);
console.log(jsonObject.name); // 输出:张三
console.log(jsonObject.age); // 输出:30
console.log(jsonObject.email); // 输出:zhangsan@example.com
}
};
单元表格
方法 | 描述 | 示例 | new XMLHttpRequest() | 创建AJAX对象 | var xhr = new XMLHttpRequest(); | xhr.open(method, url, async) | 初始化请求 | xhr.open('GET', 'https://api.example.com/data', true); | xhr.send() | 发送请求 | xhr.send(); | JSON.parse(jsonString) | 将JSON字符串解析为JavaScript对象 | var jsonObject = JSON.parse(jsonString); | xhr.onreadystatechange | 处理响应 | xhr.onreadystatechange = function() {...} |
|
|