父页面代码:
<!DOCTYPE html>
<html>
<head>
<title>parents</title>
<meta charset="UTF-8">
</head>
<body>
<script language="javascript" type="text/javascript">
function sayhello() {
alert('Hello World!');
}
var value = 'value';
</script>
<div id="default">div内容</div>
<iframe src="child.html"></iframe>
</body>
</html>
子页面
<!DOCTYPE html>
<html>
<head>
<title>child</title>
<meta charset="UTF-8">
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
//在iframe子页面中查找父页面元素
alert($('#default', window.parent.document).html());
//在iframe中调用父页面中定义的变量
alert(parent.value);
//在iframe中调用父页面中定义的方法
parent.sayhello();
});
</script>
</head>
<body>
<div>iframe子页面内容</div>
</body>
</html>
注意:父页面的属性和方法必须在iframe标签之前