json 与ajax教程,JSON & Ajax

Ajax是异步JavaScript和XML是用来在客户端作为一组相互关联的Web开发技术，以创建异步Web应用程序。 Ajax模型，Web应用程序可以发送数据和检索数据从一个服务器，而不干扰现有的页面显示行为异步。

许多开发人员使用JSON AJAX更新客户端和服务器之间传递。网站更新现场直播的体育成绩可以被视为一个AJAX例子。如果这些分数在网站上，则它们必须被存储在服务器上的网页，这样可以检索在需要时将比分。这是我们可以使用的JSON格式的数据。

可以使用JSON格式存储在Web服务器上的任何数据都使用AJAX更新。 Ajax的JavaScript的使用，以便可以检索这些JSON文件，必要时，他们解析它们，然后做了两个：

将变量作进一步处理之前，在网页上显示它们的解析值

它直接在网页中的DOM元素分配数据，这样它就会显示在网站上。

实例

下面的代码显示了JSON与Ajax，它保存在ajax.htm文件中。这里加载函数loadJSON()将用于异步到JSON数据上传。

functionloadJSON(){vardata_file="/json/data.json";varhttp_request=newXMLHttpRequest();try{// Opera 8.0+, Firefox, Chrome, Safarihttp_request=newXMLHttpRequest();}catch(e){// Internet Explorer Browserstry{http_request=newActiveXObject("Msxml2.XMLHTTP");}catch(e){try{http_request=newActiveXObject("Microsoft.XMLHTTP");}catch(e){// Something went wrongalert("Your browser broke!");returnfalse;}}}http_request.onreadystatechange=function(){if(http_request.readyState==4){// Javascript function JSON.parse to parse JSON datavarjsonObj=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();}yiibai.com JSON

Cricketer Details

NameCountrySachinIndiaUpdate Details

以下是输入文件data.json文件JSON格式的数据将被上传异步当我们单击“Update Details“按钮，这里比较简单，有兴趣的朋友可以自己测试一下。

{"name":"brett","country":"Australia"}

上面的HTML代码会产生下面的屏幕，可以检查AJAX 动作：

Name

Country

Sachin

India

当点击“Update Details“按钮，应该得到的结果如下的东西，也可以尝试自己测试JSON和AJAX 使用支持Javascript浏览器

Name

Country

brett

Australia

¥ 我要打赏

纠错/补充

收藏

下一篇：哥，这回真没有了

加QQ群啦，易百教程官方技术学习群

注意：建议每个人选自己的技术方向加群，同一个QQ最多限加 3 个群。