javascript 获取iframe里页面中元素值的方法


Posted in Javascript onFebruary 17, 2014

IE方法:
document.frames['myFrame'].document.getElementById('test').value;

火狐方法:
document.getElementById('myFrame').contentWindow.document.getElementById('test').value;

IE、火狐方法:

    function getValue(){

         var tmp = '';

         if(document.frames){

                tmp += 'ie哥说:';

                tmp += document.frames['myFrame'].document.getElementById('test').value;

         }else{

                tmp = document.getElementById('myFrame').contentWindow.document.getElementById('test').value; 

         }

         alert(tmp);

    }

示例代码:
a.html页面中的代码
<html>
            <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                <title>
                    javascript 获取iframe里页面中元素的值 测试
                </title>
           </head>
           <body>
                <iframe id="myFrame" src='b.html' style="width:300px;height: 50px;"></iframe>
                <input type="button" id="btn" onclick="getValue()" value="test" >
                <script type="text/javascript">
                        function getValue(){
                            var tmp = '';
                            if(document.frames){
                                    tmp += 'ie哥说:';
                                    tmp += document.frames['myFrame'].document.getElementById('test').value;
                            }else{
                                    tmp = document.getElementById('myFrame').contentWindow.document.getElementById('test').value; 
                            }
                            alert(tmp);
                        }
                </script>
            </body>
        </html>

b.html页面中的代码
       <html>
            <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                <title>
                    我是 iframe内的页面
                </title>
            </head>
            <body>
                <input type='text' id="test" value='欢迎访问:justflyhigh.com'>
            </body>
        </html> 
Javascript 相关文章推荐
控制打印时页眉角的代码
Feb 08 Javascript
js null,undefined,字符串小结
Aug 21 Javascript
c#和Javascript操作同一json对象的实现代码
Jan 17 Javascript
js弹出层(jQuery插件形式附带reLoad功能)
Apr 12 Javascript
js 事件截取enter按键页面提交事件示例代码
Mar 04 Javascript
jQuery实现的图片分组切换焦点图插件
Jan 06 Javascript
javascript实现2016新年版日历
Jan 25 Javascript
学习使用jquery iScroll.js移动端滚动条插件
Mar 24 Javascript
基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
May 12 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
Feb 12 jQuery
layui radio性别单选框赋值方法
Aug 15 Javascript
原来JS还可以这样拆箱转换详解
Feb 01 Javascript
JavaScript省市联动实现代码
Feb 15 #Javascript
js与运算符和或运算符的妙用
Feb 14 #Javascript
Javascript和Java获取各种form表单信息的简单实例
Feb 14 #Javascript
jquery中交替点击事件的实现代码
Feb 14 #Javascript
javascript获取form里的表单元素的示例代码
Feb 14 #Javascript
javascript删除数组元素并且数组长度减小的简单实例
Feb 14 #Javascript
javascript中apply和call方法的作用及区别说明
Feb 14 #Javascript
You might like
php下删除一篇文章生成的多个静态页面
2010/08/08 PHP
四个常见html网页乱码问题及解决办法
2015/09/08 PHP
Yii使用migrate命令执行sql语句的方法
2016/03/15 PHP
document 和 document.all 分别什么时候用
2006/06/22 Javascript
jquery 1.3.2 IE8中的一点点的小问题解决方法
2009/07/10 Javascript
JQuery从头学起第三讲
2010/07/06 Javascript
jQuery实现购物车计算价格功能的方法
2015/03/25 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
2015/10/29 Javascript
JQuery给select添加/删除节点的实现代码
2016/04/26 Javascript
JavaScript中最容易混淆的作用域、提升、闭包知识详解(推荐)
2016/09/05 Javascript
AngularJS 实现JavaScript 动画效果详解
2016/09/08 Javascript
jquery select2的使用心得(推荐)
2016/12/04 Javascript
jQuery拖拽通过八个点改变div大小
2020/11/29 Javascript
微信小程序开发探究
2016/12/27 Javascript
JS出现失效的情况总结
2017/01/20 Javascript
浅谈angularJS2中的界面跳转方法
2018/08/31 Javascript
使用webpack构建应用的方法步骤
2019/03/04 Javascript
js基础之事件捕获与冒泡原理
2019/10/09 Javascript
vue 微信扫码登录(自定义样式)
2020/01/06 Javascript
JavaScript实现串行请求的示例代码
2020/09/14 Javascript
[44:40]KG vs LGD 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
pthon贪吃蛇游戏详细代码
2019/01/27 Python
python使用Plotly绘图工具绘制气泡图
2019/04/01 Python
请用Python写一个获取用户输入数字,并根据数字大小输出不同信息的脚本
2014/05/20 面试题
考博自荐信
2013/10/25 职场文书
大一期末自我鉴定
2013/12/13 职场文书
保护环境建议书
2014/03/12 职场文书
妇联主席先进事迹
2014/05/18 职场文书
反腐倡廉标语
2014/06/24 职场文书
感恩祖国演讲稿
2014/09/09 职场文书
毕业赠语大全
2015/06/23 职场文书
高一军训感想
2015/08/07 职场文书
如何在CSS中绘制曲线图形及展示动画
2021/05/24 HTML / CSS
解决pytorch读取自制数据集出现过的问题
2021/05/31 Python
postgresql 删除重复数据案例详解
2021/08/02 PostgreSQL
Python 避免字典和元组的多重嵌套问题
2022/07/15 Python