用JS或jQuery访问页面内的iframe
用JS或jQuery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的!
假设有两个页面,在相同域下.
index.html 文件内含有一个iframe:
<!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=gb2312" />
<title>页面首页</title>
</head> <body>
<iframe src="iframe.html" id="koyoz" height="0" width="0"></iframe>
</body>
</html>
iframe.html 内容:
XML/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=gb2312" />
<title>iframe.html</title>
</head> <body>
<div id="test">www.koyoz.com</div>
</body>
</html>
1. 在index.html执行JS直接访问:
document.getElementById('koyoz').contentWindow.document.getElementById('test').style.color='red'
通过在index.html访问ID名为'koyoz'的iframe页面,并取得此iframe页面内的ID为'test'的对象,并将其颜色设置为红色.
此代码已经测试通过,能支持IE/firefox .
2. 在index.html里面借助jQuery访问:
$("#koyoz").contents().find("#test").css('color','red');
此代码的效果和JS直接访问是一样的,由于借助于jQuery框架,代码就更短了.
收集网上的一些示例：
用jQuery在IFRAME里取得父窗口的某个元素的值 只好用DOM方法与jquery方法结合的方式实现了
1. 在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input:radio").attr("checked","true");
2. 在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input:radio").attr("checked","true");
父窗口想获得IFrame中的Iframe，就再加一个frames子级就行了，如：
$(window.frames["iframe1"].frames["iframe2"].document).find("input:radio").attr("checked","true");
3.在子窗口中调用父窗口中的另一个子窗口的方法(FRAME)：
parent.frames["Main"].Fun();
注意：建议使用[]，这样比较兼容多个浏览器，() 火狐/搜狗/谷歌不兼容
用JS或jQuery访问页面内的iframe的更多相关文章
- 用JS或jQuery访问页面内的iframe,兼容IE/FF
用JS或jQuery访问页面内的iframe,兼容IE/FF js或者jQuery访问页面中的框架也就是iframe.注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.htm ...
- jQuery实现页面内锚点平滑跳转
平时我们做导航滚动到内容都是通过锚点来做,刷的一下就直接跳到内容了,没有一丝的滚动效果,而且 url 链接最后会有“小尾巴”,就像#keleyi,今天我就介绍一款 jquery 做的滚动的特效,既可以 ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
- js原生 + jQuery实现页面滚动字幕
js原生/jQuery实现页面滚动字幕效果 17:45:49 在新闻列表或者文章列表信息等页面中很容易要求实现字幕滚动的效果,以下为简单的实现页面中滚动字幕的效果 1.jQuery实现页面滚动字幕效果 ...
- js和jquery实现页面滚动监听
js和jquery实现页面滚动监听 一.总结 一句话总结:onscroll方法和监听页面元素的高度都可以实现滚动监听. 1.onscroll方法实现滚动监听的核心代码是什么? <body ons ...
- js记录用户访问页面和停留时间
1.setInterval setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval(code,millisec[,"lang" ...
- js或jquery实现页面打印(局部打印)
首先定义css样式: 复制代码代码如下: @media print { .noprint { display: none;color:green } } 对于不想打印的内容只用在标签中加上 cla ...
- JS判断手机访问页面，根据手机访问或者PC访问跳转
当用户访问你网站时,如果是PC端访问,则不作处理,如果是手机或者平板访问,就跳转到自己定义的手机页面去,这个在做webapp的时候经常用到,把代码分享给大家,希望对大家有所帮助. 首先,你要在页面中引 ...
- js或jquery实现页面打印可局部打印
方法一:直接用js的打印方法 <input id="btnPrint" type="button" value="打印" onclic ...
随机推荐
- spring-boot-nginx代理-docker-compose部署
在本地测试,使用docker部署不用在意环境 java测试项目: web框架:spring boot 框架 项目管理:maven 数据库:redis + postgres + mongo 部署相关:n ...
- CSS 选择器语法参考手册
转自:http://www.w3school.com.cn/cssref/css_selectors.asp CSS3 选择器 在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素. &quo ...
- TCP No-Delay
Nagle 算法 由于TCP中包头的大小是固定的,所以在数据(Payload)大小很小的时候IP报文的有效传输率是很低的,Nagle算法就是将多个即将发送的小段的用户数据,缓存并合并成一个大段数据时, ...
- Ubuntu下使用UFW配置防火墙（简化iptables的操作）
UFW全称为Uncomplicated Firewall,是Ubuntu系统上配置iptables防火墙的工具.UFW提供一个非常友好的命令用于创建基于IPV4,IPV6的防火墙规则. 但是,UFW是 ...
- Android中查看服务是否开启的工具类
这个也是昨天学习的,做下总结. 检查服务是否开启要写成一个工具类,方便使用,传服务的名字返回Boolean值,当然,由于须要,还要传一个上下文context. 说一下这个工具类的几个关键点: 1.方法 ...
- 【转】利用shell命令操作Memcached
原文: 张宴的博客 —— http://zyan.cc/post/384/ -------------------------------------------------------------- ...
- win10中显示wpcap.dll丢失的处理方式
win10中显示wpcap.dll丢失的处理方式 学习了:https://jingyan.baidu.com/article/4f34706e30e673e387b56dd8.html 直接安装Win ...
- 系统重装 WIN7如何创建和使用VHD文件
1 在磁盘管理中,点击操作-创建VHD,然后可以创建一个空的VHD文件 2 右击这个磁盘,点击初始化磁盘,然后可以新建简单卷 3 右击这个磁盘,设置为脱机或者联机就可以在计算机中显示和隐藏这个 ...
- IOS Object和javaScript相互调用
在IOS开发中有时会用到Object和javaScript相互调用,详细过程例如以下: 1. Object中运行javascript代码,这个比較简单,苹果提供了非常好的方法 - (NSString ...
- Linux的SOCKET编程详解（转）
Linux的SOCKET编程详解 1. 网络中进程之间如何通信 进 程通信的概念最初来源于单机系统.由于每个进程都在自己的地址范围内运行,为保证两个相互通信的进 程之间既互不干扰又协调一致工作,操作系 ...