在Web开发时,很多时候会遇到一个问题。我在一个页面嵌入了iframe,并且我想获得这个iframe页面某个元素的值。那么该如何实现这个需求呢?

先来看下演示:

效果演示

 
 

iframe1中文本框的值:

在IE下操作IFrame内容的代码:

document.frames["MyIFrame"].document.getElementById("s").style.color="blue";

但是这在Firefox下无效。所以,想到在Firefox下用FireBug来调试。经过调试发现在Firefox下可用以下代码来实现:

document.getElementById("MyIFrame").contentDocument.getElementById("s").style.color="blue";

demo代码:

    <div><iframe name="frame1" id="frame1" src="frm.html" frameborder="1" height="60"></iframe></div>  

    <p>iframe1中文本框的值:<input type="button" name="Submit" value="getValue" onclick="getValue()" /></p>  

<script type="text/javascript">
function getValue()
{
var ofrm1 = document.getElementById("frame1").document;
if (ofrm1==undefined)
{
ofrm1 = document.getElementById("frame1").contentWindow.document;
var ff = ofrm1.getElementById("txt1").value;
alert("firefox/chrome取值结果为:" + ff);
}
else
{
var ie = document.frames["frame1"].document.getElementById("txt1").value;
alert("ie取值结果为:" + ie);
}
}
</script>
 iframe页面代码:
<html>
<head>
<title>框架内页</title>
</head>
<body>
<div>
<input id="txt1" name="txt1" type="text" value="欢迎访问www.nowamagic.net" />
</div>
</body>
</html>

如何获得iframe中元素的值的更多相关文章

  1. 解析Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下   DOM方法:父窗口操作IFRAME:window.frames[&q ...

  2. Jquery取得iframe中元素的几种方法(转载)

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作 DOM方法:父窗口操作IFRAME:window.frames["iframeSon ...

  3. jquery取iframe中元素

    采取方法: $("#iframe_path").contents().find(".select_path_hide").val(); DOM方法:父窗口操作I ...

  4. [浪风转载]Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作 DOM方法:父窗口操作IFRAME:window.frames["iframeSon ...

  5. Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID

    query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下: $('#objId', parent.document);// 搞定... 在父页面 获取iframe子页面的 ...

  6. js 跨域 Jquery取得iframe中元素的几种方法

    http://www.jb51.net/article/34942.htm 收集利用Jquery取得iframe中元素的几种方法 : 父页面访问子页面 $(document.getElementByI ...

  7. C#不允许在foreach循环中改变数组或集合中元素的值(注:成员的值不受影响)

    C#不允许在foreach循环中改变数组或集合中元素的值(注:成员的值不受影响),如以下代码将无法通过编译. foreach (int x in myArray) { x++; //错误代码,因为改变 ...

  8. Jquery取得iframe中元素的几种方法

    [jquery]获取iframe中的body元素: $("iframe").contents().find("body").html(); [使用jquery操 ...

  9. webdriver如何定位多层iframe中元素

    在 web 应用中经常会出现 iframe 嵌套的应用,假设页面上有 A.B 两个 iframe,其中 B 在 A 内,那么定位 B 中的内容则需要先到 A,然后再到 B. iframe 中实际上是嵌 ...

随机推荐

  1. [Angular2 Animation] Basic animation

    @Component({ selector: 'app-courses', templateUrl: './courses.component.html', styleUrls: ['./course ...

  2. 【数学】概念的理解 —— 有序对(ordered pair)

    有序对 (a,b) 是一组对象,不同的顺序意味着不同的对象,(a,b)≠(b,a) 除非 a=b,正是因为对象的相对顺序是有着不同含义的,因此有时也称之为 2 维向量.与之相对的无序对(unorder ...

  3. 最正经的php post get

    https://www.cnblogs.com/ps-blog/p/6732448.html /** * 模拟post进行url请求 * @param string $url * @param str ...

  4. 10、bitmap格式分析

    说到图片,位图(Bitmap)当然是最简单的,它Windows显示图片的基本格式,其文件扩展名为*.BMP.在Windows下,任何各式的图片文件(包括视频播放)都要转化为位图个时候才能显示出来,各种 ...

  5. 8、linux下输入子系统

    input_sync(button_dev);    /*通知接收者,一个报告发送完毕*/ 参考:http://www.51hei.com/bbs/dpj-27652-1.html  很详细说明 in ...

  6. Android Studio2.0 Beta 2版本号更新说明及注意事项

    我们刚刚向canary channel推送了Android Studio2.0 Beta 2版本号 老毕译注: ---------- canary channel: 金丝雀版本号,平均1到2周就会更新 ...

  7. stm32的dac

  8. 细说document.ready和window.onload

    原文 简书原文:https://www.jianshu.com/p/bbf28d61aa1f 大纲 1.对页面加载的认识 2.关于document.ready() 3.关于document.onloa ...

  9. mjpg-streamer摄像头远程传输UVC

    mjpg-streamer摄像头远程传输UVC 1 下载源代码 mjpg-streamer的源代码地址  https://github.com/codewithpassion/mjpg-streame ...

  10. Eclipse 快捷键大全 分类: C_OHTERS 2014-06-01 13:05 332人阅读 评论(0) 收藏

      精选常用: 1.  ctrl+shift+r:打开资源 这可能是所有快捷键组合中最省时间的了.这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask名中的前几个字母,比如a ...