在一些非前端项目中,经常出现HTML和JSP页面中经常出现 Iframe页面嵌套格式的结构,有些场景需要子页面调用父页面的js方法,如在tab子页面获取父页面方法。
iframe页面和父页面在同一域下:不会产生跨域调用js错误
1.1子页面获取父页面元素:
$('#userId', parent.document);
1.2父页面获取子页面元素:
$("#userId", document.iframes('iframe').document) ;
2.1父页面调用子页面方法:
iframe.window.childMethod();
2.2子页面调用父页面方法:
parent.window.parentMethod();
iframe页面和父页面在不同域下:会产跨域调用js错误
//iframe页面
window.parent.postMessage('{"name":"方案管理","url":"/manage/..."}','*');
//父页面
window.addEventListener('message',function(event){
var obj = JSON.parse(event.data);
Consolo.log(obj );
});