本篇教程介绍了JavaScript基础教程 跨域获取json数据，希望阅读本篇文章以后大家有所收获，帮助大家对JavaScript的理解更加深入。

<

说到跨域，就得知道同源策略。
同源策略（Same origin policy），是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript 的浏览器都会使用这个策略。所谓同源是指，域名，协议，端口相同。它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。
同源策略就是指页面上的脚本不能访问非同源的资源(包括HTTP响应和Cookie) 
为什么要有同源策略？科普:xss攻击浏览器同源策略与跨域访问 
跨域（Cross-Domain ）：违反了同源策略，即域名、协议、端口不完全相同时，js不能进行行数据传输或通信。
跨域的错误提示：Origin XX is not allowed by Access-Control-Allow-Origin错误原因：
解决跨域的方法：
1. 通过jsonp实现跨域
虽然浏览器默认禁止了跨域访问，但并不禁止在页面中引用其他域的JS文件（不仅如此，我们还发现凡是拥有"src"这个属性的标签都拥有跨域的能力，比如<script>、<img>、<iframe>），并可以自由执行引入的JS文件中的function（包括操作cookie、Dom等等）。根据这一点，可以方便地通过创建script节点的方法来实现完全跨域的通信。jsonp正是利用这个特性来实现的。
我的天气预报的数据来源api是百度api store提供的，返回的数据是json格式。天气信息是根据登陆用户的信息变化的，所以在添加script的节点需要动态添加。
这里有个问题：动态添加的script节点如何销毁？
jQuery的ajax实现跨域
由于项目用到了jQuery框架，所以直接用jQuery的ajax或者getJSON来实现跨域。根据jQuery的api介绍（//api.jquery.com/jQuery.getJSON/#urldatacallback），getJSON只是Query的ajax的一种简化写法。利用jQuery的ajax实现跨域和自己添加script的原理是一样的，只不过我们不需要手动的插入script标签以及定义回调函数。jquery会自动生成一个全局函数来替换callback=?中的问号，之后获取到数据后又会自动销毁，实际上就是起一个临时代理函数的作用。$.getJSON方法会自动判断是否跨域，不跨域的话，就调用普通的ajax方法；跨域的话，则会以异步加载js文件的形式来调用jsonp的回调函数。参考：//www.cnblogs.com/know/archive/2011/10/09/2204005.html

   $.ajax({
                type: "GET",
                url: "//api.duoshuo.com/threads/counts.jsonp?short_name=official&threads=4ff1cbc43ae636b72a00001d",
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                    alert(errorThrown);
                    this; // 调用本次AJAX请求时传递的options参数
                },
                dataType: "jsonp",
                success: function (msg, textStatus) {
     alert(‘ok‘)
     }
   })


　　百度apistore中的天气api并支持jsonp，所以，当我采用上述方式请求数据时，返回的数据依然是json，而不是 回调函数（json）的格式，所以无法执行回调函数，此时的错误提示为：Uncaught syntax Error: unexpected token:……，这是因为服务器返回来json数据后直接放入了script标签，等script标签加载完后，会立即把响应的json当js去执行，很明显{"errNum":0,"errMsg":"success","retData":{"city":"\u5317\u4eac","pinyin":"beijing","citycode":"101010100","date":"15-03-03","time":"08:00","postCode":"100000","longitude":116.391,"latitude":39.904,"altitude":"33","weather":"\u6674","temp":"4","l_tmp":"-4","h_tmp":"4","WD":"\u5317\u98ce","WS":"5-6\u7ea7(25~34m\/h)","sunrise":"06:45","sunset":"18:07"}}不是合法的js语句，错误出现报错
2.使用HTML5 postMessage
   

本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端JavaScript频道！