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 相关文章推荐
JavaScript实现复制功能各浏览器支持情况实测
Jul 18 Javascript
微信分享的标题、缩略图、连接及描述设置方法
Oct 14 Javascript
JavaScript中的alert()函数使用技巧详解
Dec 29 Javascript
介绍一个简单的JavaScript类框架
Jun 24 Javascript
jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
Feb 16 Javascript
jQuery实现边框动态效果的实例代码
Sep 23 Javascript
模板视图和AngularJS之间冲突的解决方法
Nov 22 Javascript
Angular使用Md5加密的解决方法
Sep 16 Javascript
vue和webpack项目构建过程常用的npm命令详解
Jun 15 Javascript
Vue2.0点击切换类名改变样式的方法
Aug 22 Javascript
angular实现input输入监听的示例
Aug 31 Javascript
JS开发自己的类库实例分析
Aug 28 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
整合了前面的PHP数据库连接类~~做成一个分页类!
2006/11/25 PHP
新手菜鸟必读:session与cookie的区别
2013/08/22 PHP
php通过session防url攻击方法
2014/12/10 PHP
PHP内存使用情况如何获取
2015/10/10 PHP
使用PHP处理数据库数据如何将数据返回客户端并显示当前状态
2016/02/16 PHP
解决Laravel blade模板转义html标签的问题
2019/09/03 PHP
PHP执行linux命令6个函数代码实例
2020/11/24 PHP
Iframe 自适应高度并实时监控高度变化的js代码
2009/10/30 Javascript
JQUBAR1.1 jQuery 柱状图插件发布
2010/11/28 Javascript
DWZ table的原生分页浅谈
2013/03/01 Javascript
cookie中的path与domain属性详解
2013/12/18 Javascript
javascript转换静态图片,增加粒子动画效果
2015/05/28 Javascript
javascript去掉代码里面的注释
2015/07/24 Javascript
js数组常用最重要的方法
2018/02/04 Javascript
Bootstrap table表格初始化表格数据的方法
2018/07/25 Javascript
微信小程序仿知乎实现评论留言功能
2018/11/28 Javascript
微信小程序自定义组件实现环形进度条
2020/11/17 Javascript
使用Promise封装小程序wx.request的实现方法
2019/11/13 Javascript
layui前端时间戳转化实例
2019/11/15 Javascript
Vue优化:常见会导致内存泄漏问题及优化详解
2020/08/04 Javascript
Python MD5文件生成码
2009/01/12 Python
scrapy-redis源码分析之发送POST请求详解
2019/05/15 Python
Selenium+Python 自动化操控登录界面实例(有简单验证码图片校验)
2019/06/28 Python
python 中如何获取列表的索引
2019/07/02 Python
利用Python自动化操作AutoCAD的实现
2020/04/01 Python
Roots加拿大官网:加拿大休闲服饰品牌
2016/10/24 全球购物
英国领先的隐形眼镜在线供应商:Lenstore.co.uk
2019/11/24 全球购物
师范生实习的个人自我鉴定
2013/10/20 职场文书
大型车展策划方案
2014/02/01 职场文书
班主任工作经验材料
2014/02/02 职场文书
初中差生评语
2014/12/29 职场文书
2015年教师党员公开承诺书
2015/01/22 职场文书
英文慰问信
2015/02/14 职场文书
关于感恩的作文
2019/08/26 职场文书
Python中三种花式打印的示例详解
2022/03/19 Python
类和原型的设计模式之复制与委托差异
2022/07/07 Javascript