• 使用原生ajax处理json组成的数组


    和前一篇文章一样,直接上代码了,只是做个记录。

    1. 数据的提供页面,tigong.php
      <?php
      header("content-type:text/html;charset=utf-8");
      echo '[{"name":"黎明","age":"12","sex":"男"},{"name":"小红","age":"12","sex":"女"},{"name":"增益","age":"22","sex":"男"}]';
      ?>
    2. 使用eval得方法处理
      <!DOCTYPE html>
      <html lang="en">
      <head>
          <meta charset="UTF-8">
          <script type="text/javascript">
              window.onload=function(){
                  var div1=document.getElementById("div1");
                  var bt1=document.getElementById("bt1");
                  bt1.onclick=function(){
                      //创建ajax对象,写兼容
                      if(window.XMLHttpRequest){
                          var xmlHttp=new XMLHttpRequest();
                      }else{
                          var xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                      };
                      //获取要发送的数据,我们这个例子没有
                      //设置发送数据的地址和方法
                      xmlHttp.open("POST","tigongjson.php");
                      //设置我们的请求头信息
                      xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
                      //绑定onreadystatechange事件
                      xmlHttp.onreadystatechange=function(){
                          if(xmlHttp.readyState==4 && xmlHttp.status==200){
                              var data=xmlHttp.responseText;
                              //json字符串转换成为json对象
                              data=eval("("+data+")");
                              var str="";
                              for(var i=0;i<data.length;i++){
                                  str+="姓名"+data[i].name+"<br>";
                                  str+="年龄"+data[i].age+"<br>";
                                  str+="性别"+data[i].sex+"<br>";
                                  };
                                  div1.innerHTML=str;
                          };
                      };
                      //发送数据
                      xmlHttp.send();
                  };
              };
          </script>
          <style type="text/css">
              #div1{
                  width:200px;
                  height:200px;
                  background:#f00;
                  color:#fff;
              }
              img{
                  width:200px;
              }
          </style>
          <title>Document</title>
      </head>
      <body>
          <div id="div1">
              <img src="../php2/images/1.gif">
          </div>
          <br>
          <button id="bt1">点击获取json数据</button>
      </body>
      </html>


    3. 使用JSON.parse()方法进行处理
      <!DOCTYPE html>
      <html lang="en">
      <head>
          <meta charset="UTF-8">
          <script type="text/javascript">
              window.onload=function(){
                  var div1=document.getElementById("div1");
                  var bt1=document.getElementById("bt1");
                  bt1.onclick=function(){
                      //创建ajax对象,写兼容
                      if(window.XMLHttpRequest){
                          var xmlHttp=new XMLHttpRequest();
                      }else{
                          var xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                      };
                      //获取要发送的数据,我们这个例子没有
                      //设置发送数据的地址和方法
                      xmlHttp.open("POST","tigongjson.php");
                      //设置我们的请求头信息
                      xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
                      //绑定onreadystatechange事件
                      xmlHttp.onreadystatechange=function(){
                          if(xmlHttp.readyState==4 && xmlHttp.status==200){
                              var data=xmlHttp.responseText;
                              //json字符串转换成为json对象
                              data=JSON.parse(data);
                              var str="";
                              for(var i=0;i<data.length;i++){
                                  str+="姓名:"+data[i].name+"<br>";
                                  str+="年龄:"+data[i].age+"<br>";
                                  str+="性别:"+data[i].sex+"<br>";
                                  };
                              div1.innerHTML=str;
                          };
                      };
                      //发送数据
                      xmlHttp.send();
                  };
              };
          </script>
          <style type="text/css">
              #div1{
                  width:200px;
                  height:200px;
                  background:#f00;
                  color:#fff;
              }
              img{
                  width:200px;
              }
          </style>
          <title>Document</title>
      </head>
      <body>
          <div id="div1">
              <img src="../php2/images/1.gif">
          </div>
          <br>
          <button id="bt1">点击获取json数据</button>
      </body>
      </html>
  • 相关阅读:
    COM学习(三)——数据类型
    com学习(一)GUID 和 接口
    Dll学习(二)__declspec用法详解
    dll 学习(一)
    PostMessage与SendMessage的区别(二)
    sendmessage和postmessage的区别
    用Java开发代理服务器
    JAVA编写WEB服务器
    【1.3】Django HelloWorld
    【1.2】初识Django应用
  • 原文地址:https://www.cnblogs.com/Gabriel-Wei/p/6002223.html
Copyright © 2020-2023  润新知