js/jquery获取iframe子页面中元素的方法:

一、使用window.frames["iframe的ID"]获取元素

window.onload = function() {
var oIframe = window.frames["oIframe"].document.getElementById("getFrame");
console.log(oIframe);
}

注意:此处一定要加上window.onload或者DOMContentLoaded,也就是DOM加载或者页面加载完成后。

二、使用window.name获取元素

var oIDframe = window.oIframe.document.getElementById("getFrame");
console.log(oIDframe);
oIframe是iframe的name属性值,这种获取方法不必写在window.onload或者DOMContentLoaded中,请自行测试。

三、使用getElementById获取元素 
var oIdFrame = document.getElementById("oIframe").contentWindow.document.getElementById("getFrame");
console.log(oIdFrame);

使用document.getElementById获取本页面的iframe元素后,再获取iframe子页面的元素。这种获取方法不必写在window.onload或者DOMContentLoaded中

四、使用jquery获取

var ojIframe = $("#oIframe").contents().find("#getFrame").html();
console.log(ojIframe);

js/jquery  iframe子页面获取父页面元素的方法:

      一、使用js

var fatherEle = window.parent.document.getElementById("title");
console.log(fatherEle);

  二、使用jq

var fatherEleJq = $("#title",parent.document);
console.log(fatherEleJq);

父页面:

<div id="title">
index包含iframe子页面
</div>
<div id="parent">
<iframe name="oIframe" id="oIframe" src="iframe.html" frameborder="0" width="1000" height="562"></iframe>
</div>

iframe.html子页面:

<div id="getFrame">iframe</div>

参考链接:http://java-my-life.iteye.com/blog/1275205

父子页面之间元素相互操作(iframe子页面)的更多相关文章

  1. 父页面操作iframe子页面的安全漏洞及跨域限制问题

    一.父子交互的跨域限制 同域情况下,父页面和子页面可以通过iframe.contentDocument或者parent.document来交互(彼此做DOM操作等,如父页面往子页面注入css). 跨域 ...

  2. Iframe父页面与子页面之间的相互调用

    iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者i ...

  3. JQuery操作iframe父页面与子页面的元素与方法

    JQuery操作iframe父页面与子页面的元素与方法 JQUERY IFRAME 下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS也可以实现. 第一.在iframe中查找父页面元 ...

  4. JS中iframe子页面与父页面之间通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

  5. js 在iframe子页面获取父页面元素,或在父页面 获取iframe子页面的元素的几种方式

    用JS或jquery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.html 文件内含有一个iframe: XML/HTML代码 ...

  6. iframe父页面获取iframe子页面的元素 与 iframe子页面获取父页面元素

    一.在iframe子页面获取父页面元素代码如下:$('#objld', parent.document); 二.在父页面获取iframe子页面的元素代码如下:$("#objid", ...

  7. iframe子页面获取父页面元素的方法

    在iframe子页面获取父页面元素 代码如下: $.('#objld', parent.document); 在父页面获取iframe子页面的元素 代码如下: $("#objid" ...

  8. Js动态获取iframe子页面的高度////////////////////////zzzz

    Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...

  9. js之iframe子页面与父页面通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

随机推荐

  1. xcode8 storyboard 控件显示错位

    升级xcode8 后选择device 为6s 出现上面的情况,控件显示异常.使用Update Frame 显示正常.不能选择Update Constraints   如果误选 commend + Z ...

  2. [tableView reloadData] 和 runloop

    需要[tableView reloadData]后需要立即获取tableview的cell.高度,或者需要滚动tableview,那么,直接在reloadData后执行代码是会有问题的. 断点调试感觉 ...

  3. iOS报错[__NSCFNumber length]: unrecognized

    出现这种报错很大的原因是因为类型给错了,或许你这个数据是从json上解析后得到的,但是需要看一下这个数据是NSString还是NSNumber类型,如果是NSNumber类型的话,你又直接使用NSSt ...

  4. Java Web之网上购物系统(注册、登录、浏览商品、添加购物车)

    眼看就要期末了,我的专业课也迎来了第二次的期末作业---------<网上购物系统>.虽然老师的意图是在锻炼我们后台的能力,但是想着还是不利用网上的模板,准备自己写,以来别人写的静态页看不 ...

  5. Json生成与解析

    JSON常用与服务器进行数据交互,JSON中"{}"表示JSONObject,"[]"表示JSONArray 如下json数据: {"singers& ...

  6. (十)Maven依赖详解

    1.何为依赖? 比如你是个男的,你要生孩子,呸呸呸...男的怎么生孩子,所以你得依赖你老婆,不过也不一定咯,你也可以依赖其她妹子. 我们在平时的项目开发中也是同理,你需要依赖一些东西才能实现相应的功能 ...

  7. Mysql的Haproxy反向代理和负载均衡

    HaProxy提供高可用性.负载均衡以及基于TCP和HTTP应用的代理,支持虚拟主机,它是免费.快速并且可靠的一种解决方案.应用到Haproxy主要是因为他免费,并且基于TCP和HTTP的应用代理. ...

  8. Spring ApplicationContext 简解

    ApplicationContext是对BeanFactory的扩展,实现BeanFactory的所有功能,并添加了事件传播,国际化,资源文件处理等.   configure locations:(C ...

  9. MapReduce 常见SQL模型解析

    MapReduce应用场景 前一阵子参加炼数成金的MapReduce培训,培训中的作业例子比较有代表性,用于解释问题再好不过了.有一本国外的有关MR的教材,比较实用,点此下载. MR能解决什么问题?一 ...

  10. WebServices:WSDL的结构分析

    WSDL(Web Services Description Language,Web服务描述语言)是为描述Web Services发布的XML格式.W3C组织没有批准1.1版的WSDL,但是2.0版本 ...