在父窗口中获取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. NSIS:禁止多次安装实例

    原文 NSIS:禁止多次安装实例 为了防止用户重复安装软件,我们可以加入以下的判断来进行限制. 第一步:在安装脚本中,将是否已安装的标记Installed写入注册表中: 1 Section -Post ...

  2. strtok、strtok_s、strtok_r 字符串切割函数

    1.strtok函数 函数原型:char * strtok (char *str, const char * delimiters); 參数:str,待切割的字符串(c-string):delimit ...

  3. SQLServer-----SQLServer 2008 R2卸载

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaGVrZXdhbmd6aQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...

  4. 5、VS2010+ASP.NET MVC4+EF4+JqueryEasyUI+Oracle该项目的开发——使用datagrid做报表

    来点需要:我使用的数据库访问EF框架,但是,因为使用一个动态表来的统计报告中.单独是每天产生基于数据表,它是很难使用EF加盟前.所以我包装在两组数据库存取层的框内,一个是EF,一种是传统的ADO.NE ...

  5. swift 笔记 (七) —— 关闭

    关闭 封闭件是从包括以下各项的组.它可以在代码被发送"片"... 行,不纠结的定义.继续. swift的闭包,有点像C和Objective-C语言里的 代码块 {--}  闭包能够 ...

  6. hdu1588---Gauss Fibonacci(矩阵,线性复发)

    根据题意:最后一步是寻求f(b) + f(k + b) + f(2 * k + b) + -+ f((n-1) * k + b) 清除f(b) = A^b 间A = 1 1 1 0 所以sum(n - ...

  7. ACM-凸多边形的计算几何——hrbust1429

    凸多边形 称号:http://acm.hrbust.edu.cn/index.php?m=ProblemSet&a=showProblem&problem_id=1429 Descri ...

  8. JavaScript的类型、值和变量的总结

    前言:JavaScript的数据类型分为两类:原始类型和对象类型.5种原始类型:数字.字符串.布尔值.null(空).undefined(未定义).对象是属性的集合,每个属性都由“名/值对”(值可以是 ...

  9. Git合并多个Commit

    当前有四个commit,现在要将四个commit合并为一个,可以使用git rebase -i HEAD~{这里是要合并的commit数量} 如 git rebase -i HEAD~4 ,即为合并最 ...

  10. HDU 4085 Steiner树

    主题链接:pid=4085">http://acm.hdu.edu.cn/showproblem.php? pid=4085 由于这题专门花一晚上学习斯坦纳树.找到比較好的学习资料,链 ...