js操作iframe父子窗体示例


Posted in Javascript onMay 22, 2014

父窗体获取iframe

window.iframeId

iframe获取父窗口

window.parent

parent.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript"> 
function btnFn(){ 
window.subWin.test(); 
} 
function get(name){ 
return document.getElementById(name); 
} 
</script> 
</head> 
<body> 
<input id="name" type="text" value="222"> 
<input type="button" id="btn" value="点击" onclick="btnFn();"><br/> 
<br/><br/> 
<iframe src="sub.html" id="subWin" 
name="subWin" width="100%" marginwidth="0" height="100%" 
marginheight="0" scrolling="Yes" frameborder="0" valign="middle" 
resize="no" style="display: block;border:3px solid red;"></iframe> </body> 
</html>

sub.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript" > 
function test(){ 
alert(window.parent.get("name").value);//结果:222 
} </script> 
</head> 
<body> 
我是窗体的内容 
</body> 
</html>
Javascript 相关文章推荐
根据出生日期自动取得星座的js代码
Jul 20 Javascript
另一个javascript小测验(代码集合)
Jul 27 Javascript
JavaScript中的object转换函数toString()与valueOf()介绍
Dec 31 Javascript
Javascript 字符串模板的简单实现
Feb 13 Javascript
JavaScript实现数组降维详解
Jan 05 Javascript
jQuery tip提示插件(实例分享)
Apr 28 jQuery
jQuery中hover方法搭配css的hover选择器,实现选中元素突出显示方法
May 08 jQuery
jQuery手风琴的简单制作
May 12 jQuery
js简易版购物车功能
Jun 17 Javascript
如何在vue里添加好看的lottie动画
Aug 02 Javascript
Vue.Draggable拖拽功能的配置使用方法
Jul 29 Javascript
用JS写一个发布订阅模式
Nov 07 Javascript
JS实现根据当前文字选择返回被选中的文字
May 21 #Javascript
JS动态增加删除UL节点LI及相关内容示例
May 21 #Javascript
jQuery异步验证用户名是否存在示例代码
May 21 #Javascript
jQuery取id有.的值的方法
May 21 #Javascript
jQuery判断复选框是否勾选的原理及示例
May 21 #Javascript
在页面加载完成后通过jquery给多个span赋值
May 21 #Javascript
JS 弹出层 定位至屏幕居中示例
May 21 #Javascript
You might like
图书管理程序(二)
2006/10/09 PHP
全世界最小的php网页木马一枚 附PHP木马的防范方法
2009/10/09 PHP
php session_start()关于Cannot send session cache limiter - headers already sent错误解决方法
2009/11/27 PHP
使用PHP下载CSS文件中的图片的代码
2013/09/24 PHP
使用PHP生成图片的缩略图的方法
2015/08/18 PHP
浅析PHP7新功能及语法变化总结
2016/06/17 PHP
PHP单例模式定义与使用实例详解
2017/02/06 PHP
Laravel5.5新特性之友好报错以及展示详解
2017/08/13 PHP
Laravel如何实现自动加载类
2019/10/14 PHP
prototype.js的Ajax对象
2006/09/23 Javascript
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
2007/08/31 Javascript
JQuery 入门实例1
2009/06/25 Javascript
jquery学习笔记二 实现可编辑的表格
2010/04/09 Javascript
js制作简易年历完整实例
2015/01/28 Javascript
bootstrap datepicker限定可选时间范围实现方法
2016/09/28 Javascript
微信小程序 生命周期详解
2016/10/12 Javascript
nodejs基于mssql模块连接sqlserver数据库的简单封装操作示例
2018/01/05 NodeJs
nodejs+mongodb aggregate级联查询操作示例
2018/03/17 NodeJs
微信小程序如何像vue一样在动态绑定类名
2018/04/17 Javascript
vue项目如何刷新当前页面的方法
2018/05/18 Javascript
微信小程序实现分享到朋友圈功能
2018/07/19 Javascript
vue实现拖拽效果
2019/12/23 Javascript
JS forEach跳出循环2种实现方法
2020/06/24 Javascript
jQuery实现B2B网站后台管理系统侧导航
2020/07/08 jQuery
在Vue中使用Echarts实例图的方法实例
2020/10/10 Javascript
[02:58]献给西雅图的情书_高清
2014/05/29 DOTA
python中的实例方法、静态方法、类方法、类变量和实例变量浅析
2014/04/26 Python
python错误:AttributeError: 'module' object has no attribute 'setdefaultencoding'问题的解决方法
2014/08/22 Python
使用requests库制作Python爬虫
2018/03/25 Python
Python3内置模块random随机方法小结
2019/07/13 Python
如何使用repr调试python程序
2020/02/28 Python
Python的PIL库中getpixel方法的使用
2020/04/09 Python
入学生会自荐书范文
2014/02/05 职场文书
态度决定一切演讲稿
2014/05/20 职场文书
社团活动总结书
2014/06/27 职场文书
联想win10摄像头打不开怎么办?win10笔记本摄像头打不开解决办法
2022/04/08 数码科技