在父窗口中获取iframe中的元素

IE下：
格式：window.frames["iframe的name值"].document.getElementById("iframe中控件的ID").click();

实例：window.frames["ifm"].document.getElementById("btnOk").click(); 
都支持的方法：
格式：document.getElementById("iframe的ID值").contentWindow.document.getElementsByName('radios');//IE firefox支持

在iframe中获取父窗口的元素

Js代码

格式：window.parent.document.getElementById("父窗口的元素ID").click();

实例：window.parent.document.getElementById("btnOk").click();

jquery

在父窗口中获取iframe中的元素

格式：$("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1

实例：$("#ifm").contents().find("#btnOk").click();//jquery 方法1

格式：$("#iframe中的控件ID",document.frames("frame的name").document).click();//jquery 方法2

实例：$("#btnOk",document.frames("ifm").document).click();//jquery 方法2

在iframe中获取父窗口的元素

格式：$('#父窗口中的元素ID', parent.document).click();

实例：$('#btnOk', parent.document).click();  

如果页面跨域，上面的方法都不行！

实例代码：index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

<p>当前框架</p>

<iframe src="if.html" width="300" height="300" id="currentif" name="currentif"></iframe>

</body>

</html>

<script language="javascript">

window.onload = function(){

   var sd =  window.top.document.getElementById("currentif").contentWindow;
   //这里去掉前面的window.top也可以

   var son = sd.document.getElementById("linkif");

   son.onclick = function(){

       alert("1");

      };

}
//这里一定要放到onload下。如果直接写，可能导致元素获取失败！

</script>

实例代码：if.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>

<body>

<p id="linkif">嵌入的框架</p>

</body>

</html>

如何通过js获取iframe框架中的内容的更多相关文章

  1. javascript_获取iframe框架中元素节点的属性值

    1. DOM:文档对象模型 [window 对象] 它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,是显示于窗口 ...

  2. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  3. js获取iframe里的body内容

    做个页面 需要加入a.html 使用的js动态添加iframe 直接JQ添加的 代码 $(".banner-box").after(“<iframe src="ht ...

  4. js 获取iframe页面元素

      js 获取iframe页面元素 CreationTime--2018年8月16日18点00分 Author:Marydon <!-- chart图表 --> <iframe id ...

  5. 网站开发进阶(十八)js获取html标签中的值

    js获取html标签中的值 项目开发过程中,由于需求所迫,需要获取html标签元素中的内容,下面做一简单总结.以下所讲的示例适用于其它标签元素. 主要包括2中方法获取元素内容: 方法一:.innerT ...

  6. 在iframe框架中全屏不好使的原因

    遇到的问题:我是在iframe框架中添加了一个插件在360和火狐中不好使,将allowfullscreen="true" 属性配置好就没问题了: 可能出现的原因:将allowful ...

  7. 重写iframe内联框架中的内容

    重写iframe内联框架中的内容,不使用src指向页面url,主动写入HTML代码: var ifr = document.getElementById("CMBC-certificatio ...

  8. Java 获取*.properties配置文件中的内容 ，常见的两种方法

    import java.io.InputStream; import java.util.Enumeration; import java.util.List; import java.util.Pr ...

  9. js 获取iframe中的元素

    今天要修改编辑器插件中的元素遇到的问题 jquery 在父窗口中获取iframe中的元素 1.Js代码 格式:$("#iframe的ID").contents().find(&qu ...

随机推荐

  1. （一）IE8以下background不起作用

    最近遇到了些小bug,在这里做个记录分享下.低版本的浏览器不支持新属性或者说对代码的解析方式不一样,导致最后解析出来的结果五花八门,各种浏览器之间的兼容的确是一个令开发人员头疼的事情,不过有时候换一个 ...

  2. linux0.11学习笔记（2）

    makefile文件: makefile 文件是make 实用简介.make 程序是用Makefile最后一次改变的数据文件和代码文件(last-modification time)确定哪些文件需要更 ...

  3. U盘启动盘安装Win7/9/10系统攻略

    UltraISO制作U盘启动盘安装Win7/9/10系统攻略 U盘安装好处就是不用使用笨拙的光盘,光盘还容易出现问题,无法读取的问题.U盘体积小,携带方便,随时都可以制作系统启动盘. U盘建议选择8G ...

  4. web开发性能优化---UI接口章

    1.尽可能的远div+css设计 DIV+CSS与表相比格优势布局: a.精简代码 采用DIV+CSS设计,页面代码精简.这是为了XHTML了解都知道. 代码精简所带来的直接优点有两点:一是提高蜘蛛爬 ...

  5. thinkphp学习笔记4—眼花缭乱的配置

    原文:thinkphp学习笔记4-眼花缭乱的配置 1.配置类别 ThinkPHP提供了灵活的全局配置功能,ThinkPHP会依次加载管理配置>项目配置>调试配置>分组配置>扩展 ...

  6. 【Flume NG用户指南】（2）构造

    作者:周邦涛(Timen) Email:zhoubangtao@gmail.com 转载请注明出处:  http://blog.csdn.net/zhoubangtao/article/details ...

  7. UBUNTU如何改变mysql默认文件夹数据文件夹

    停止mysql维修 * sudo /etc/init.d/mysql stop 原始文件夹的副本 * cp -r /var/lib/mysql /home/yourname/somewhere 改动权 ...

  8. OJ提交题目中的语言选项里G++与C++的区别（转载）

    原文链接:http://blog.polossk.com/201405/c-plus-plus-g-plus-plus G++? 首先更正一个概念,C++是一门计算机编程语言,G++不是语言,是一款编 ...

  9. 自定义View视图

    自定义View视图文件查找逻辑 之前MVC5和之前的版本中,我们要想对View文件的路径进行控制的话,则必须要对IViewEngine接口的FindPartialView或FindView方法进行重写 ...

  10. Jquery学习（三）选择

    1.Jquery最重要的是选择. 学习要点:        1.简单选择器        2.进阶选择器        3.高级选择器 ①简单选择器. 最简单的也就是最经常使用的,最经常使用的一般也是 ...