AJAX是异步JavaScript和XML，它在客户端用作一组相互关联的Web开发技术，以便创建异步Web应用程序.根据AJAX模型，Web应用程序可以异步发送和检索服务器中的数据，而不会干扰显示和现有页面的行为.
许多开发人员使用JSON在两者之间传递AJAX更新客户端和服务器.更新直播体育比分的网站可以被视为AJAX的一个例子.如果必须在网站上更新这些分数，则必须将它们存储在服务器上，以便网页可以在需要时检索分数.这是我们可以使用JSON格式数据的地方.
使用AJAX更新的任何数据都可以使用Web服务器上的JSON格式进行存储.使用AJAX以便javascript可以在必要时检索这些JSON文件，解析它们，并执行以下操作之一 :
将解析后的值存储在变量中，以便在网页上显示之前进行进一步处理.
它直接将数据分配给网页中的DOM元素，这样它们就会显示在网站上.
以下代码显示了JSON与AJAX.将其另存为 ajax.htm 文件.这里加载函数loadJSON()以异步方式用于上传JSON数据.
<html>
<head>
<meta content = "text/html; charset = ISO-8859-1" http-equiv = "content-type">
<script type = "application/javascript">
function loadJSON() {
var data_file = "http://www.it352.com/json/data.json";
var http_request = new XMLHttpRequest();
try{
// Opera 8.0+, Firefox, Chrome, Safari
http_request = new XMLHttpRequest();
}catch (e) {
// Internet Explorer Browsers
try{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
try{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}catch (e) {
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
http_request.onreadystatechange = function() {
if (http_request.readyState == 4 ) {
// Javascript function JSON.parse to parse JSON data
var jsonObj = JSON.parse(http_request.responseText);
// jsonObj variable now contains the data structure and can
// be accessed as jsonObj.name and jsonObj.country.
document.getElementById("Name").innerHTML = jsonObj.name;
document.getElementById("Country").innerHTML = jsonObj.country;
}
}
http_request.open("GET", data_file, true);
http_request.send();
}
</script>
<title>it352.com JSON</title>
</head>
<body>
<h1>Cricketer Details</h1>
<table class = "src">
<tr><th>Name</th><th>Country</th></tr>
<tr><td><div id = "Name">Sachin</div></td>
<td><div id = "Country">India</div></td></tr>
</table>
<div class = "central">
<button type = "button" onclick = "loadJSON()">Update Details </button>
</div>
</body>
</html>以下是输入文件 data.json ，具有JSON格式的数据，当我们点击
{"name ":"Brett"，"country":"Australia"}以上HTML代码将生成以下屏幕，您可以在其中检查AJAX的操作:
| 名称 | 国家 |
|---|---|
| Sachin | 印度 |
当您单击更新详细信息按钮时，您应该得到如下结果.如果您的浏览器支持Javascript，您可以自己尝试 JSON with AJAX .
| 名称 | 国家 |
|---|---|
| Brett | 澳大利亚 |
