<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>xml</title> </head> <body> <div id="div"></div> <button id="person">加载信息</button> <script type="text/javascript"> //声明全局XMLHttpRequest对象 var myXmlHttpRequest; if(window.XMLHttpRequest){ myXmlHttpRequest = new XMLHttpRequest(); }else{ myXmlHttpRequest = new ActiveObject("Microsoft.XMLHTTP"); } var numb = 0; document.getElementById("person").onclick = function(){ var url="/app/json/a.json"; /* O 表示未发送,open()函数还没执行。 1 表示已发送,send()函数还没执行。 2 send函数已执行,头部和状态吗都可以获取了。 3 头部已收到,但响应体在解析中。 4 表示请求已完成,包括响应头和响应体的内容已经接收到了。 客户端跨域的XMLHttpRequest需要服务端的支持来保证JSON资源请求成功。 服务器端在响应头加上带有Access-Control-Allow前缀的属性为跨域资源共享提供支持。 CORS(Cross-Origin Resource Sharing)使得跨域资源共享的同时还可以禁止某些域名访问。 */ myXmlHttpRequest.onreadystatechange = function(){ if(myXmlHttpRequest.readyState===4&&myXmlHttpRequest.status===200){ var myObject = JSON.parse(myXmlHttpRequest.responseText); var myJSON = JSON.stringify(myObject); var div = document.getElementById("div"); div.innerHTML = myJSON; } } console.log("走了"+(++numb)); myXmlHttpRequest.open("GET",url,true); myXmlHttpRequest.send(); } </script> </body> </html>