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

更新时间：2016年01月09日 19:02:25 作者：一落叶而知秋

这篇文章主要向大家介绍了js父页面中使用子页面的方法，即js父页面使用iframe中的函数，感兴趣的朋友可以参考一下

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

<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中的代码

<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>

上面两个代码可以在父页面和子页面对对方的函数进行相互调用，比较简单，不多介绍了。
希望本文所述对大家学习javascript程序设计有所帮助。

您可能感兴趣的文章:

JS实现移动端整屏滑动的实例代码
本文通过实例代码给大家分享了基于js 实现移动端整屏滑动效果，基本思路是检测手指滑动方向，获取手指抬起时的位置，减去手指按下时的位置，得正即为向下滑动了，具体实现代码大家参考下本文
2017-11-11
JavaScript随机生成颜色的方法
这篇文章主要介绍了JavaScript随机生成颜色的方法的相关资料,非常不错，代码简单易懂，具有参考借鉴价值，需要的朋友可以参考下
2016-10-10
JavaScript实现仿网易通行证表单验证
这篇文章主要介绍了JavaScript实现仿网易通行证表单验证，十分的实用，有需要的小伙伴可以参考下。
2015-05-05
js中点击空白区域时文本框与隐藏层的显示与影藏问题
文本框获得焦点的时在文本框的下方显示一个浮动层，点击文本框隐藏浮动层，下面为大家介绍下鼠标点击时文本框与隐藏层处理问题，感兴趣的朋友可以参考下
2013-08-08
JS操作Fckeditor的一些常用方法(获取、插入等)
这篇文章主要介绍了JS操作Fckeditor的一些常用方法，主要包括获取、插入等,需要的朋友可以参考下
2020-02-02
解决低版本的浏览器不支持es6的import问题
下面小编就为大家分享一篇解决低版本的浏览器不支持es6的import问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-03-03
使用canvas实现魔法摄像头的示例代码
我们用手机的摄像头自拍,很容易实现简单的自拍效果,如复古、黑白等等,其实我们使用web端的JavaScript也是可以实现的,接下来就带领小伙伴实现一个魔法摄像头,并且提供了截图下载功能,需要的朋友可以参考下
2023-08-08
一文详解Javascript内存机制与垃圾回收
这篇文章主要给大家详细介绍了Javascript的内存机制与垃圾回收，文中又详细的代码示例，对我们学习Javascript有一定的帮助，需要的同学可以借鉴阅读
2023-06-06
使用原生js写ajax实例(推荐)
下面小编就为大家带来一篇使用原生js写ajax实例(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-05-05
js获取指定字符前/后的字符串简单实例
下面小编就为大家带来一篇js获取指定字符前/后的字符串简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10