Ajax拿取JSON格式的数据

JSON简介

JSON(javaScript Object Notation) 一种简单的数据格式，比xml更轻巧。 JSON是javaScript原生格式。这意味着在 javaScript中处理JSON数据不需要任何特殊的API或工具包。
JSON的规则很简单：对象是一个无序的“‘名称／值’对”集合。一个对象以“{”(做括号)开始，“}”(右括号)结束。但每个“名称”后跟一个“ ：”（冒号）；“’名称／值‘对”之间使用“，”（逗号）分隔。

解析JSON

JSON只是一种文本字符串，它被存储在responsetext属性中
为了读取存储在responseText属性中的JSON数据，需要根据javaScript对eval语句。函数eval会把一个字符串当作它对参数，然后这个字符串会被当作javaScript代码来执行。因为JSON 对字符串就是由javaScript代码构成的，所以它本身是可执行的
JSON提供了json.js包，下载http://www.json.org/json.js后，使用parseJSON()方法将字符串解析JS

var jsonResponse=xhr.responseText;var personObject=jsonResponse.parseJSON();var name=personObject.person.name;var website=personObject.person.website;var email=personObject.person.email;

JSON小结

优点：

作为一种数据传输格式，JSON与XML很相似，但是它更加灵巧。
JSON不需要从服务器端发送含有特定内容类型的首部信息

缺点

语法过于严谨
代码不易读
eval函数存在风险

解析JSON文件代码示例

1、json数据(所在文件：json,js)代码：

{"person": {"name": "JBK","website": "http://baidu.com/","email": "15204510180@163.com"
}
}

2、解析代码：

<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script>window.onload = function () {var  as= document.getElementsByTagName("a");for(var i=0;i< as.length;i++){as[i].onclick= function () {var request = new XMLHttpRequest();var url = this.href;var method="GET";request.open(method,url);request.send(null);request.onreadystatechange= function () {if( request.readyState==4){if(request.status==200||request.status==304){                                var result=request.responseText;var objectJSON=eval("("+result+")");
//                                2、结果不能直接使用,必须先创建对应但节点,再把节点加入到#detail中
//                                目标格式为:
//                                      <h2><a href="mailto:15204510180@163.com">JBK</a></h2>
//                                      <a href="http://baidu.com/">http://baidu.com</a>var name=objectJSON.person.name;var website=objectJSON.person.website;var email=objectJSON.person.email;//alert(name);//alert(website);//alert(email);var aNode=document.createElement("a");aNode.appendChild(document.createTextNode(name));aNode.href="maelto:"+email;var hNode=document.createElement("h2");hNode.appendChild(aNode);var aNode1=document.createElement("a");aNode.appendChild(document.createTextNode(website));aNode.href=website;var dNode=document.getElementById("details");dNode.innerHTML="";dNode.appendChild(aNode);dNode.appendChild(aNode1)}}}return false;}}}</script>
</head>
<body>
<a href="json.js">1</a>
<a href="json.js">2</a>
<a href="json.js">3</a>
<a href="json.js">4</a>
<div id="details"></div></body>
</html>

三种数据格式对比小结

若应用程序不需要与其他应用程序共享数据的时候，使用HTML片段来返回数据时最简单
如果数据需要重用，JSON文件是个不错的选择，其在性能和文件大小方面有优势
当远程应用程序未知时，XML文档是首选，因为XML是web服务器领域的“世界语”

Ajax拿取JSON格式的数据相关推荐

$.ajax返回的JSON格式的数据后无法执行success的解决方法
$.ajax返回的JSON格式的数据后无法执行success的解决方法参考文章: (1)$.ajax返回的JSON格式的数据后无法执行success的解决方法 (2)https://www.cnbl ...
Python爬虫 scrapy框架爬取智联招聘，并把数据存入数据库，存为json格式的数据
First:创建项目:执行下面三句命令: 1. scrapy startproject zhilianzhaopin2. cd zhilianzhaopin3.scrapy genspider zhi ...
ajax调取mysql数据显示在html_jQuery+Ajax+js请求json格式数据并渲染到html页面
json格式的数据文件有两种方式一种是xxx.json文件一种是xxx.php文件前者是json格式的文件后者是输出json格式的文件前者是本地的文件后者是获取数据库的数据再输出成json ...
java异步请求显示数据格式_JSON(四）——异步请求中前后端使用Json格式的数据进行交互...
json格式的数据广泛应用于异步请求中前后端的数据交互,本文主要介绍几种使用场景和使用方法. 一,json格式字符串 functionsentAjax(){ $.ajax({ type:'POST', ...
处理JSON格式的数据
JSON格式的数据是最常用的数据格式,处理方法的选择就显得比较重要了.我常用的一种是用对象来接收,然后保存在数组中,需要时直接从数组中取值.下面列出一个小例子. 1.在.h文件中: #import & ...
php 接收curl json数据格式,curl发送 JSON格式POST数据的接收，以及在yii2框架中的实现原理【精细剖析】...
1.通过curl发送json格式的数据,譬如代码: function http_post_json($url, $jsonStr) { $ch = curl_init(); curl_setopt($ ...
Spring MVC--自定义HttpMessageConverter接收JSON格式的数据
替换默认的Jackson,使用fastjson来处理json格式的数据. index.jsp <%@ page language="java" contentType=&qu ...
Spring MVC--接收JSON格式的数据
Spring mvc使用开源的Jackson包来处理JSON格式的请求或相应消息. index.jsp <%@ page language="java" contentTyp ...
[SoapUI] 通过SoapUI发送POST请求，请求的body是JSON格式的数据
通过SoapUI发送POST请求,请求的body是JSON格式的数据: data={"currentDate":"2015-06-19","reset ...

Ajax拿取JSON格式的数据

JSON简介

解析JSON

JSON小结

优点：

缺点

解析JSON文件代码示例

三种数据格式对比小结

Ajax拿取JSON格式的数据相关推荐

最新文章

热门文章