父页面代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
盒子
<p>
<iframe src="11.html" id="iframe"></iframe>
</p>
</div>
<script>
var nameO = '1.html';
function m(){
console.log(nameO);
}
var iframe = document.getElementById('iframe');
iframe.contentWindow.m = m; // 强制给iframe绑定函数
// console.log(iframe.contentWindow);
</script>
</body>
</html>
子页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
iframe
<script>
m();
</script>
</body>
</html>
注意点: 会有函数重复定义异常的情况发生,需要注意避免一下
相关扩展: contentWindow 属性返回当前HTMLIFrameElement的Window对象。你可以使用这个Window 对象去访问这个 iframe 的文档和它内部的 DOM. 这个是可读属性,但是它的属性像全局Window 一样是可以操作的。