原创力文档- 1、本文档共111页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
查看更多
iframe跨域通信的通用解决方案-第二弹!(终极解决方案)
篇一：前端解决跨域问题的8种方案(最新最全)
1) 在/a.html中：
document.domain = #39;#39;;
varifr = document.createElement(#39;iframe#39;);
ifr.src= #39;/b.html#39;;
ifr.display= none;
document.body.appendChild(ifr);
ifr.onload= function(){
var doc = ifr.contentDocument ||ifr.contentWindow.document; //在这里操作doc，也就是b.html
ifr.onload = null; };
2) 在/b.html中：
document.domain = #39;#39;;
这个没什么好说的，因为script标签不受同源策略的限制。
functionloadScript(url, func) {
var head = document.head || document.getElementByTagName(#39;head#39;)[0]; var script = document.createElement(#39;script#39;);
script.src=url;
script.onload= script.oeadystatechange = function(){
if(!this.readyState || this.readyState==#39;loaded#39; ||
this.readyState==#39;complete#39;){
func();
script.onload= script.oeadystatechange = null;
}
};
head.insertBefore(script, 0);
}
window.baidu= {
sug: function(data){
console.log(data);
}
}
loadScript(#39;/su?wd=w#39;,function(){console.log(#39;loaded#39;)});
//我们请求的内容在哪里？
//我们可以在chorme调试面板的source中看到script引入的内容
原理是利用
location.hash来进行传值。
假设域名下的文件cs1.html要和域名下的cs2.html传递信息。
1) cs1.html首先创建自动创建一个隐藏的iframe，iframe的src指向域名下的cs2.html页面
2) cs2.html响应请求后再将通过修改cs1.html的hash值来传递数据
3) 同时在cs1.html上加一个定时器，隔一段时间来判断location.hash的值有没有变化，一旦有变化则获取获取hash值
注：由于两个页面不在同一个域下IE、Chrome不允许修改parent.location.hash的值，所以要借助于域名下的一个代理iframe
代码如下：
先是下的文件cs1.html文件：
functionstartRequest(){
varifr = document.createElement(#39;iframe#39;);
ifr.style.display= #39;none#39;;
ifr.src= #39;/lab/cscript/cs2.html#paramdo#39;; document.body.appendChild(ifr);
}
functioncheckHash() {
try {
var data = location.hash ? location.hash.substring(1) : #39;#39;;
if (console.log) {
console.log(#39;Now the data is #39;+data);
}
} catch(e) {};
}
setInterval(checkHash, 2000);
域名下的cs2.html:
//模拟一个简单的参数处理操作
switch(location.hash){
case #39;#paramdo#39;:
callBack();
break;
case #39;#paramset#39;:
//do something……
break;
}
functioncallBack(){
try {
parent.location.has
文档评论（0）