初认识json

最新推荐文章于 2024-09-13 17:32:25 发布

eqyun2012

最新推荐文章于 2024-09-13 17:32:25 发布

阅读量610

点赞数

分类专栏： ajax 文章标签： json xmlhttprequest function exception html javascript

本文链接：https://blog.csdn.net/eqyun2012/article/details/6730013

版权

ajax 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

打开126邮箱，用firbug查看，会发现

看它的响应

126邮件就是结合了ajax和json来交换信息的

那什么是json呢？

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于阅读和编写

换句话说，又是一个数据类型，但它比xml简单，方便。关于json 和xml 的对比请baidu。个人比较喜欢json

来看个例子

text.json

{
	"root":[
		{"id":"1",
		 "name":"eqyun"},
		 {"id":"2",
		 	"name":"eqyunnn"}
	       ]
	}

text.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
<html>   
  <head>        
    <title>jsontest.html</title>   
    <meta http-equiv="content-type" content="text/html; charset=utf-8">   
  

    <script type="text/javascript">  
	function createXMLHttpRequest() {   
        var req;   
         if (window.XMLHttpRequest) {   
        req = new XMLHttpRequest();   
    }else if (window.ActiveXObject) {   
        req = new ActiveXObject("Microsoft.XMLHTTP");   
    }   
    return req;   
}   
        var req = createXMLHttpRequest();   
        function startRequest(){   
            try{   
                req.onreadystatechange = handleStateChange;   
                req.open("GET", "test.json", true);   
                req.send(null);       
            }catch(exception){   
                alert("");   
            }     
        }   
        function handleStateChange(){       
            if(req.readyState == 4){    
			//alert("aa");    
				var content=document.getElementById("content");
				content.innerHTML="";
				var ul=document.createElement("ul");   
                 if (req.status == 200 || req.status == 0){   
                    // 取得返回字符串   
                    var resp = req.responseText;   
					//alert(resp);
                    // 构造返回JSON对象的方法   
                    var func = new Function("return " + resp);   
                    // 得到JSON对象   
                    var json = func();   
					//alert(json.root.length);
                    // 显示返回结果   
                   for(var i=0;i<json.root.length;i++){
				   	var li=document.createElement("li");
					ul.appendChild(li);
					li.innerHTML="姓名:"+json.root[i].name+" ";
					li.innerHTML+="id:"+json.root[i].id;
				   }   
				   content.appendChild(ul);
                  }   
             }   
         }         
    </script>   
  </head>     
  <body>    
	<label>
        <input type="button" value="load json"οnclick="startRequest()" />   
		</label>
		<div id="content"></div>
  </body>   
</html>

什么都不需要，只要写好json，json的格式很简单。然后用ajax的get一下，返回的就是一个字符串，js提供了将json转为数组的方法

var func = new Function("return " + resp);   
                    // 得到JSON对象   
 var json = func();

之后就可以操作数组一样，操作json。json中也是“键”----"值“的格式

对它更深入的应用还不懂啊，什么时候用json比较方便，还得继续学习

eqyun2012

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录