在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. 如何获取已经安装到苹果手机上的App信息

    //如何获取已经安装到苹果手机上的App信息? Is it possible to get the information (app icon, app name, app location) abo ...

  2. trident原理及编程指南

    目录 trident原理及编程指南 一.理论介绍 1.trident是什么? 2.trident处理单位 3.事务类型 二.编程指南 1.定义输入流 2.统计单词数量 3.输出统计结果 4.split ...

  3. 关于Linux启动时挂载rootfs的几种方式

    一直对Linux启动时挂载根文件系统的过程存在着很多疑问,今天在水木精华区找到了有用的资料,摘录如下: 1.Linux启动时,经过一系列初始化之后,需要mount 根文件系统,为最后运行init进程等 ...

  4. 最正经的php post get

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

  5. vue学习笔记二：v-if和v-show的区别

    v-if vs v-show v-if 是“真正的”条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建. v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做—— ...

  6. error: { "$err" : "not master and slaveOk=false", "code" : 13435 }

    rsguo:SECONDARY> db.users.find();error: { "$err" : "not master and slaveOk=false&q ...

  7. Node.js日志框架选型比較：Bunyan

    前一篇Node.js日志框架选型比較:Winston Bunyan Bunyan(by Trent Mick)是另外一个值得考虑的日志框架,以稍微不同的方式处理结构化,机器可读性被重点对待. 其结果是 ...

  8. [React] Create & Deploy a Universal React App using Zeit Next

    In this lesson, we'll use next to create a universal React application with no configuration. We'll ...

  9. C# 软件编码规范

    一.代码注释 并不是所有的代码均需要注释. 1.类头部注释 /// <summary> /// 描述类的用途 /// 作者: 张三 /// 日期: 2015/12/1 /// </s ...

  10. Codeforces 491B. New York Hotel 最远曼哈顿距离

    最远曼哈顿距离有两个性质: 1: 对每一个点(x,y)  分别计算  +x+y , -x+y , x-y , -x-y 然后统计每种组合的最大值就能够了, 不会对结果产生影响 2: 去掉绝对值 , 设 ...