在Web应用程序中,我们常常需要通过网络快速把数据发送到服务器和从服务器返回数据到客户端。AJAX是一种使用JavaScript和XMLHttpRequest对象来实现无需刷新整个页面即可更新部分页面内容的技术。而json则是一种轻量级的数据交换格式,常用于客户端和服务器之间的数据传输。
AJAX通过一次异步请求和响应的方式来实现与服务器的数据传输。而json则可以在JavaScript中轻松地构建和解析。因此,AJAX与json结合使用是非常有用的。
var xhr = new XMLHttpRequest(); // 创建XHR对象
xhr.open('POST','/server',true); // 配置XHR对象
xhr.setRequestHeader('Content-type','application/json;charset=utf-8');
var data = {
name: 'Tom',age: 18
};
xhr.send(JSON.stringify(data)); // 发送json数据
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText); // 解析json响应
console.log(response);
}
};
上述代码发送了一个包含name和age的json对象到服务器,并解析了服务器返回的json数据。在调用send()方法之前,我们需要设置Content-type头部,它告诉服务器我们发送的是json数据。