获取子iframe框架的元素
我们常常遇到使用iframe框的时候,该iframe框不能根据自己内部的内容撑起来的这种问题
必要条件:不能在跨域的情况下。。。本地可以放到localhost下进行测试
//父页面index.html页面
<iframe id="ifr" src="iframe1.html" frameborder="0" width="100%" name="iframe1"></iframe>
//框架iframe.html
<body>
<div id="btn1">
我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我 是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>我是iframe1的内容<br/>
</div>
</body>
如何 获取子iframe框 的元素呢??
window.frames['iframe1'].document.getElementById('btn1');//获取name为iframe1的btn1
//比如你可以给它添加事件:
window.frames['iframe1'].document.getElementById('btn1').onclick = function(){
alert(1)
}
注意 要将代码放到window.onload = function(){...}里,否则因为没有加载完全dom节点会报错
如何 获取父iframe框 的元素呢??
parent.document.getElementById('click-btn').onclick = function() {
console.log('打印父元素中点击的节点内容:'+ this.innerHTML);
}//在iframe框中获取父页面的节点
最后,让子iframe框架高度自适应代码:
// 计算页面的实际高度,iframe高度自适应
function calcPageHeight(doc) {
var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
var height = Math.max(cHeight, sHeight)
return height
}
var ifr = document.getElementById('ifr')
ifr.onload = function() {
var iDoc = ifr.contentDocument || ifr.document
var height = calcPageHeight(iDoc)
ifr.style.height = height + 'px'
}
获取子iframe框架的元素的更多相关文章
- .NET前后台-JS获取/设置iframe内对象元素并进行数据处理
转载请注明出处:果冻栋吖 这个主要是修改H3BPM一个批量审批的功能时候做的.先看下图: H3自带了批量审批的功能,也就是按钮1,有审批意见3,但是如果3里边不填写内容点击1之后,效果就是表单里边没有 ...
- javascript_获取iframe框架中元素节点的属性值
1. DOM:文档对象模型 [window 对象] 它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,是显示于窗口 ...
- jQuery控制iframe框架内元素
用jQuery在IFRAME里取得父窗口的某个元素的值只好用DOM方法与jquery方法结合的方式实现了 1.在父窗口中操作 选中IFRAME中的所有单选钮$(window.frames[" ...
- JS获取/设置iframe内对象元素、文档的几种方法
1.IE专用(通过frames索引形象定位): document.frames[i].document.getElementById('元素的ID'); 2.IE专用(通过iframe名称形象定位): ...
- 【转】获取/设置IFRAME内对象元素的几种JS方法
1.IE专用(通过frames索引形象定位): document.frames[i].document.getElementById('元素的ID'); 2.IE专用(通过IFRAME名称形象定位): ...
- 关于使用iframe,父元素无法获得子iframe对的元素
首先确定自己写的方法对不对: $(document.getElementById('iframe的ID').contentWindow.document.body).find("要获得的元素 ...
- 获取iframe内的元素
$("#iframeID").contents().find("#index_p") 2获取父窗体的值 $('#father', parent.document ...
- 【学习】如何用jQuery获取iframe中的元素
(我的博客网站中的原文:http://www.xiaoxianworld.com/archives/292,欢迎遇到的小伙伴常来瞅瞅,给点评论和建议,有错误和不足,也请指出.) 说实在的,以前真的很少 ...
- js操作iframe框架时应该屡清楚的一些概念
1.获取iframe的window对象 存在跨域访问限制. iframeElement.contentWindow 兼容 2.获取iframe的document对象 存在跨域访问限制. chrome: ...
随机推荐
- 【Linux】- vi/vim
所有的 Unix Like 系统都会内建 vi 文书编辑器,其他的文书编辑器则不一定会存在. 但是目前我们使用比较多的是 vim 编辑器. vim 具有程序编辑的能力,可以主动的以字体颜色辨别语法的正 ...
- Linux系统的性能测试
性能测试:CPU内存,硬盘IO读写,带宽速度,UnixBench 一.CPU物理个数.内核.超线程.多核心 1.登录Terminal,执行:cat /proc/cpuinfo,就会显示出主机的CPU详 ...
- WCF面试精典题汇总
1.WCF接口中的参数改名问题 在写WCF Web Service接口的时候,如果你对接口的参数名做改动的时候,一定要记住Update所有应用该Web service的客户端的Referrence,否 ...
- echarts 画 canvas 如果在IE8下不显示图标
网上说法很多,可能版本问题,也有说script标签位置问题(放在body中) 不过先试已下,清除option对象中多余的逗号(,) 对象的最后一个属性后不要有逗号结尾
- 移动端body跟着模态框一起滑动问题
遇到了一个问题,是点击链接出现弹框,弹框里面的内容是可以滑动的,结果我滑动的时候发现下面的body也跟着一起滑动,先看一下代码. 弹框的 HTML: <div class="mask& ...
- bzoj3502[PA2012]Tanie Linie(最大k区间和)
题意:给定一个长为n的数列,要求选出最多k个不相交的区间(可以不选),使得选中的数字之和最大.(1<=k<=n<=1000000)分析:首先我们通过预处理对问题做一些简化.原序列中的 ...
- Luogu1053 NOIP2005篝火晚会
首先造出所要求的得到的环.如果将位置一一对应上,答案就是不在所要求位置的人数.因为显然这是个下界,并且脑补一下能构造出方案达到这个下界. 剩下的问题是找到一种对应方案使错位数最少.可以暴力旋转这个环, ...
- P4035 [JSOI2008]球形空间产生器
题目描述 有一个球形空间产生器能够在 nn 维空间中产生一个坚硬的球体.现在,你被困在了这个 nn 维球体中,你只知道球面上 n+1n+1 个点的坐标,你需要以最快的速度确定这个 nn 维球体的球心坐 ...
- P3385 【模板】负环
题目描述 暴力枚举/SPFA/Bellman-ford/奇怪的贪心/超神搜索 输入输出格式 输入格式: 第一行一个正整数T表示数据组数,对于每组数据: 第一行两个正整数N M,表示图有N个顶点,M条边 ...
- 使用Visual C ++和Open Folder自定义环境
使用Visual C ++和Open Folder自定义环境 来源 https://blogs.msdn.microsoft.com/vcblog/2016/10/05/bring-your-c-co ...