<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>xml</title>
</head>
<body>
	<div id="div"></div>
	<script type="text/javascript">
		var myXmlHttpRequest = new XMLHttpRequest();
		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;
			}
		}
		myXmlHttpRequest.open("GET",url,true);
		myXmlHttpRequest.send();
	</script>
</body>
</html>

JSON ： app/json/a.json

{
	"name":"码农007",
	"addr":"北京海淀",
	"工作":"程序员",
	"hobby":[
		"IT技术",
		"跑步",
		"健身",
		"天文学",
		"音乐"
	]
}

JSON异步及跨域的更多相关文章

  1. json _ ajax_跨域

    1 json 1 js 对象 语法: 1 通过一对{}表示一个对象 2 在{}中允许通过 key:value 的形式来表示属性 3 多对的属性和值之间使用 , 隔开 2 什么中JSON 按照JS对象的 ...

  2. 访问本地json文件因跨域导致的问题

    我使用jquery的getJSON的方法获取本地的json文件,并进行操作,获取json 数据代码如下: $.getJSON("invite_panel.json",functio ...

  3. json解决ajax跨域的原理

    jsonp只能解决GET类型的ajax请求跨域问题 jsonp请求不是ajax请求,而是一般的get请求 基本原理 浏览器端: 动态生成<script>来请求后台接口(src就是接口的ur ...

  4. GTA项目 二, JSON接口开放跨域访问

    public class CORSAttribute : ActionFilterAttribute { public string Domains { get; set; } public CORS ...

  5. 谷歌通过ajax获取本地JSON文件，为什么会显示跨域？转载的

    在本地写了一段JSON代码,然后用ajax读取后,在浏览器打开,发现谷歌提示涉及到跨域问题, 但是跨域是由于协议,域名,端口中有一个不同,才会跨域,我在本地访问自己的文件,怎么和跨域扯上关系了?? 谷 ...

  6. 谷歌通过ajax获取本地JSON文件，为什么会提示跨域？

    在本地写了一段JSON代码,然后用ajax读取后,在浏览器打开,发现谷歌提示涉及到跨域问题, 但是跨域是由于协议,域名,端口中有一个不同,才会跨域,我在本地访问自己的文件,怎么和跨域扯上关系了?? 下 ...

  7. 同源策略、跨域、json和jsonp

    同源策略 源(origin)就是协议.域名和端口号.若地址里面的协议.域名和端口号均相同则属于同源. 以下是相对于 http://www.a.com/test/index.html 的同源检测 • h ...

  8. spring boot + spring security +前后端分离【跨域】配置 + ajax的json传输数据

    1.前言 网上各个社区的博客参差不齐 ,给初学者很大的困扰 , 我琢磨了一天一夜,到各个社区找资料,然后不断测试,遇到各种坑,一言难尽啊,要么源码只有一部分,要么直接报错... 最后实在不行,直接去看 ...

  9. 跨域利器JSONP(转)

    何为跨域?何为JSONP?JSONP技术能实现什么?是否有必要使用JSONP技术? 跨域 就是由于JavaScript同源策略的限制,使得a.com域名下的js无法操作b.com或c.a.com域名下 ...

随机推荐

  1. 图片预加载之模拟img.load()

    function imgBatchLoad(){ var instance = this; this.loadCount = 0; this.images = []; this.imgCount = ...

  2. java基础06 Java中的递归

      一.递归是指直接或间接地调用自身. 二.递归的注意事项:             A:要有出口,否则就是死递归 B:次数不能过多,否则内存溢出 C:构造方法不能递归使用     三.举例子  递归 ...

  3. [Open Source] .NET 基于StackExchange.Redis的扩展

    目录 简介 主从复制 备份与恢复 API AddOrUpdate GetOrAdd DeleteByPattern SearchKeys TransExcute Subscribe/Publish T ...

  4. jquery-ajax实现文件上传异常处理web.multipart.MultipartException

    异常如下: org.springframework.web.multipart.MultipartException: The current request is not a multipart r ...

  5. RabbitMQ 知识总结

    RabbitMQ知识总结 AMQP协议 AMQP协议是一个提供统一消息服务的应用层标准协议,并不会受到客户端/中间件不同产品.不同开发语言等条件的影响.RabbitMQ则是基于该协议实现的. 举个例子 ...

  6. Stacked Regression的详细步骤和使用注意事项

    声明:这篇博文是我基于一篇网络文章翻译的,并结合了自己应用中的一些心得,如果有侵权,请联系本人删除. 最近做推荐的时候,开始接触到Stacking方法,在周志华老师的西瓜书中,Stacking方法是在 ...

  7. year：2017 month：7 day：18

    2017-07-18 JavaScript 1javascript的控制语句 (1) if语句 (2)if(){}else 语句 (3) if(){} else if(){ }语句 (4)switch ...

  8. 移动端300ms点击事件的延迟

    移动端click事件300ms延迟 移动端click事件300ms的延迟在目前看来,已经是老生常谈了. 以下内容,我会在参考资源的基础上谈谈我对移动端click事件300ms延迟的一些理解.本人愚昧, ...

  9. Python网络数据采集4-POST提交与Cookie的处理

    Python网络数据采集4-POST提交与Cookie的处理 POST提交 之前访问页面都是用的get提交方式,有些网页需要登录才能访问,此时需要提交参数.虽然在一些网页,get方式也能提交参.比如h ...

  10. 26. leetcode 350. Intersection of Two Arrays II

    350. Intersection of Two Arrays II Given two arrays, write a function to compute their intersection. ...