温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

Ajax如何使用JSON数据格式

发布时间:2021-09-15 18:40:56 来源:亿速云 阅读:155 作者:小新 栏目:web开发

这篇文章给大家分享的是有关Ajax如何使用JSON数据格式的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

1:

JSON(JavaScriptObject Notation)一种简单的数据格式,比xml更轻巧。JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包。
JSON的规则很简单:对象是一个无序的“‘名称/值'对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值'对”之间使用“,”(逗号)分隔。
JSON用冒号(而不是等号)来赋值。每一条赋值语句用逗号分开。整个对象用大括号封装起来。可用大括号分级嵌套数据。
对象描述中存储的数据可以是字符串,数字或者布尔值。对象描述也可存储函数,那就是对象的方法。

<span >{"person": {  "name":"Andy Budd",  "website":"http://andybudd.com/",  "email":"andy@clearleft.com"  }  }</span>

JSON 只是一种文本字符串。它被存储在responseText 属性中
为了读取存储在 responseText 属性中的JSON 数据,需要根据JavaScript 的eval语句。函数 eval会把一个字符串当作它的参数。然后这个字符串会被当作 JavaScript 代码来执行。因为 JSON 的字符串就是由 JavaScript 代码构成的,所以它本身是可执行的

2:案例

<%@ page language="java" pageEncoding="UTF-8"%>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  <head>  <meta http-equiv="content-type" content="text/html; charset=utf-8" />  <title>People at Clearleft</title>  <style type="text/css">  @import url("clearleft.css");  </style>  <script type="text/javascript">  window.onload=function(){  var aNodes=document.getElementsByTagName("a");  for(var i = 0;i < aNodes.length; i++){  aNodes[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==304){  var result=request.responseText; //json被存储在responseText属性中  var object=eval("("+result+")"); //读取responseText中的json数据  var name= object.person.name; //读取json对象中存储的数据  var website= object.person.website;  var email= object.person.email;  var aNode=document.createElement("a");  aNode.appendChild(document.createTextNode(name+":"+"email"+":"+website));  aNode.href="mailTo"+"email"+",website";  var h3Node=document.createElement("h3");  h3Node.appendChild(aNode);  var dtails=document.getElementById("details");  details.innerHTML=""; //防止重复的添加字符串  dtails.appendChild(h3Node);  }  }  }  return false;  }  }  };  </script>  </head>  <body>  <h2>  People  </h2>  <ul>  <li>  <a href="files/andy.js">Andy</a>  </li>  <li>  <a href="files/richard.js">Richard</a>  </li>  <li>  <a href="files/jeremy.js">Jeremy</a>  </li>  </ul>  <div id="details"></div>  </body>  </html>

感谢各位的阅读!关于“Ajax如何使用JSON数据格式”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI