js父页面中使用子页面的方法

184 阅读 0 评论 122 点赞

我是靠谱客的博主聪明钢笔，这篇文章主要介绍js父页面中使用子页面的方法，现在分享给大家，希望可以做个参考。

iframe是非常常用的一个html元素，如果在父页面中使用子页面的方法应该怎么写呢，下面就做一下简单的介绍。
一、父页面代码

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head>
<meta charset=" gb2312">
<title>父页面</title>
<script type="text/javascript">
function parentFunction() 
{
 alert('function in parent');
}
function callChild() 
{
 child.window.childFunction();
 /*
  child 为iframe的name属性值，
  不能为id，因为在FireFox下id不能获取iframe对象
 */
}
</script>
</head>
<body>
 <iframe name="child" src="./child.html" ></iframe>
</body>
</html>

二、iframe中的代码

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<meta charset="gb2312">
<title>iframe代码</title>
<script type="text/javascript">
function childFunction() 
{
 alert('function in child');
}
function callParent() 
{
 parent.parentFunction();
}
</script>
</head>
<body>
</body>
</html>