本文已参与「新人创作礼」活动，一起开启掘金创作之路
初识跨域
什么是跨域？ 指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。
所谓同源是指，域名 ，协议，端口均相同，只要有一个不同，就是跨域。不明白没关系，举个栗子：
www.123.com/index.html 调用 www.123.com/server.php （非跨域）
www.123.com/index.html 调用 www.456.com/server.php （主域名不同:123/456，跨域）
abc.123.com/index.html 调用 def.123.com/server.php （子域名不同:abc/def，跨域）
www.123.com:8080/index.html 调用 www.123.com:8081/server.php （端口不同:8080/8081，跨域）
www.123.com/index.html 调用 www.123.com/server.php （协议不同:http/https，跨域）
请注意：localhost和127.0.0.1虽然都指向本机，但也属于跨域。
浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。 跨域会阻止什么操作？
浏览器是从两个方面去做这个同源策略的，一是针对接口的请求，二是针对Dom的查询
1.阻止接口请求比较好理解，比如用ajax从http://192.168.100.150:8020/实验/jsonp.html页面向http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp发起请求，由于两个url端口不同，所以属于跨域，在console打印台会报No ‘Access-Control-Allow-Origin’ header is present on the requested resource
值得说的是虽然浏览器禁止用户对请求返回数据的显示和操作，但浏览器确实是去请求了，如果服务器没有做限制的话会返回数据的，在调试模式的network中可以看到返回状态为200，且可看到返回数据
2.阻止dom获取和操作
关于iframe中对象的获取方式请看：js iframe获取documen中的对象为空问题_lianzhang861的博客-CSDN博客_获取iframe的document
比如a页面中嵌入了iframe，src为不同源的b页面，则在a中无法操作b中的dom，也没有办法改变b中dom中的css样式。
而如果ab是同源的话是可以获取并操作的。
