JavaScript读取JSON一些方法总结

2016-02-22    编辑:Crese     点击(
在js中读取JSON的方法我接触到的有两种,一种是obj.name方式访问,另一种是数组形式方式,下面我来给大家分享介绍与举例说明。

方法一:函数构造定义法返回

 代码如下 复制代码

var strJSON = "{name:'json name'}";//得到的JSON
var obj = new Function("return" + strJSON)();//转换后的JSON对象
alert(obj.name);//json name

方法二:js中著名的eval函数

 代码如下 复制代码

var strJSON = "{name:'json name'}";//得到的JSON
var obj = eval( "(" + strJSON + ")" );//转换后的JSON对象
alert(obj.name);//json name

第二种方法需要注意的是,对象表达式{'name':'json name'}必须用“()”扩住,否则

 代码如下 复制代码

var strJSON = "{name:'json name'}";
var obj = eval(strJSON);
alert(obj.constructor);//String 构造函数
alert(obj.name);//undefine

必须把对象表达式扩起来eval执行才能生成一个匿名对象!

例1

 代码如下 复制代码

var data={ name:"李狗蛋", age:"21", height:"189cm", gender:"男", weight:"60KG" }

for(var i in data){

console.log(i+':"'+data[i]+'"');

}

//结果:name:"李狗蛋"......

例2,ajax提交数据然后返回 json数据由js处理

 代码如下 复制代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
  <head>
    <title>异步调用JSON</title>
  </head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript">
  <!--
   var xmlhttp;
    // 创建XMLHTTPRequest对象
    function createXMLHTTPRequest()
    {
         if(window.ActiveXObject)//②如果当前浏览器为IE
         {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         }
         else if(window.XMLHTTPRequest)//③如果是其他浏览器
         {
            xmlhttp = new XMLHTTPRequest();
         }
    }
   
    function getInfo()
    {
      createXMLHTTPRequest();
      xmlhttp.open("get", "/webapp/front/dealerapi!getdealerlist.action", true);
      xmlhttp.onreadystatechange = returnInfo;
      xmlhttp.send(null);
    }
   
    function returnInfo()
    {
      if(xmlhttp.readyState == 4)
      {
       var info = xmlhttp.responseText;
       eval("var json= " + info);
       var message="";
    var dealerlocation="";
    var salesphone="";
      for(var i=0;i<json.dealers.length;i++){
     message+="经销商名称:<font style='color:red;'>" + json.dealers[i].name + "</font>&nbsp;&nbsp;<br/>";
           salesphone+="经销商电话:<font style='color:red;'>" + json.dealers[i].salesphone + "</font>&nbsp;&nbsp;<br/>";
     dealerlocation+="经销商经纬度:<font style='color:red;'>" + json.dealers[i].location + "</font>&nbsp;&nbsp;<br/>";
   }
   

       document.getElementById("showInfo").innerHTML = message;
    document.getElementById("salesphone").innerHTML = salesphone
    document.getElementById("location").innerHTML=dealerlocation;
      }
    }

  -->
  </script>
  <body>
 
  <br/><br/>
  <h2 style="color: red;">异步调用JSON</h2>
  <br/><input type="button" value="获取JSON数据" onclick="getInfo()" />
   <table>
    <tr>
 <td><div id="showInfo"></div></td>
 <td><span id="salesphone"><span></td>
    <td><span id="location"><span></td>
 </tr>
   </table>
  </body>
</html>