js不同主域跨域;
前提,www.a.com下a.html,a.html内iframe调用了www.b.com下的b.html,b.html下iframe调用了www.a.com下的c.html
前提,www.a.com下a.html,a.html内iframe调用了www.b.com下的b.html,b.html下iframe调用了www.a.com下的c.html
b.html是不无法直接访问a.html的对象,因为涉及到跨域,但可以访问parent,同样c.html的parent可以访问b.html。c.html和a.html同域,是可以访问a下的对象的。parent.parent.js对象!
a.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<body>
<label for="text">输入:</label><input type="text" name="text" id="text"/>
<input type="button" value="提交" οnclick="show()"/>
<iframe id="myfarme"></iframe>
<ul id="getText"></ul>
<script>
function show() {
var text = document.getElementById('text').value;
var href = location.href;
href = href.substring(0,href.lastIndexOf("/")) + "/c.html";
document.getElementById('myfarme').src="b.html?content="+encodeURI(text)+"&backUrl="+encodeURI(href);
}
function dosome(text){
document.getElementById("getText").innerHTML= decodeURI(text);
}
</script>
</body>
</html>
b.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<body>
<input type="button" value="add" οnclick="add()"/>
<input type="button" value="click" οnclick="show()"/>
<iframe id="myfarme" hidden></iframe>
<script>
var uri = "${uri}";
var content = ${content};
var result = content;
function add() {
result = content + 1;
}
function show() {
document.getElementById('myfarme').src = uri + "?&message=" + encodeURI(result);
}
</script>
</body>
</html>
c.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
window.onload = function(){
var text = window.location.href.split('=')[1];
console.log(parent.parent);
parent.parent.dosome(text);
}
</script>
</head>
<body>
</body>
</html>