AJax的使用json数据的传输回调函数

最新推荐文章于 2021-08-05 22:05:12 发布

sdfujichao

最新推荐文章于 2021-08-05 22:05:12 发布

阅读量719

点赞数 1

分类专栏： Ajax 文章标签： ajax 前端

本文链接：https://blog.csdn.net/sdfujichao/article/details/51305866

版权

Ajax 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

用 eval（）函数进行解析，把数据解析成对象模型，内容就成了对象的属性。

<!DOCTYPE html>

<html>
   <head>
       <meta charset="utf-8" />
       <title>Ajax的基本使用和封装</title>
   </head>
   <body>
       <input type="button" id="divNextId" value="下一页"/>
       <div id="DivUserNameId"style="width: 500px; height: 500px; background-color: #ccc;"></div>
   </body>
   <script type="text/javascript">
       // 封装的ajax方法。
       function creatXmlHttp(url){
           //第一步创建一个XMLHttpRequest对象，兼容IE低版本
           var varXmlr = null;
           if(window.XMLHttpRequest){
               varXmlR = new XMLHttpRequest();
           }else{
               var varXmlR = new ActiveXObject("Micrsoft.XMLHTTP");
           }

           varXmlR.onreadystatechange = function (){
               //判断是否正确返回数据
               if(varXmlR.readyState==4 && varXmlR.status==200){
                   action(varXmlR.responseText);
               }
           }
           // 打开某个网页
           varXmlR.open("GET",url,true);
           // 发送请求数据
           varXmlR.send();
       }

       var myBtnNext = document.getElementById("divNextId");
       var myDivUserName = document.getElementById("DivUserNameId");

       myBtnNext.onclick = function(){
           creatXmlHttp("test1.txt");
       }
       function action(date){
           var dateee = eval("("+date+")"); // 解析数据成模型
           myDivUserName.innerHTML = dateee.people[2];

       }
   </script>

</html>