如何从<iframe>中获得<div> ?
当前回答
window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')
CallYourFunction()是页面内部的函数和它上面的函数动作
其他回答
你可以使用这个函数来查询页面上的任何元素,不管它是否嵌套在一个iframe(或多个iframe)中:
function querySelectorAllInIframes(selector) {
let elements = [];
const recurse = (contentWindow = window) => {
const iframes = contentWindow.document.body.querySelectorAll('iframe');
iframes.forEach(iframe => recurse(iframe.contentWindow));
elements = elements.concat(contentWindow.document.body.querySelectorAll(selector));
}
recurse();
return elements;
};
querySelectorAllInIframes('#elementToBeFound');
注意:请记住,页面上的每个iframe都必须是同源的,否则该函数将抛出错误。
其他的答案都对我不起作用。我最终在我的iframe中创建了一个函数,返回我正在寻找的对象:
function getElementWithinIframe() {
return document.getElementById('copy-sheet-form');
}
然后像这样调用该函数来检索元素:
var el = document.getElementById("iframeId").contentWindow.functionNameToCall();
不要忘记在加载后访问iframe。旧但可靠的方法没有jQuery:
<iframe src="samedomain.com/page.htm" id="iframe" onload="access()"></iframe>
<script>
function access() {
var iframe = document.getElementById("iframe");
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
console.log(innerDoc.body);
}
</script>
window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')
CallYourFunction()是页面内部的函数和它上面的函数动作
var iframe = document.getElementById('iframeId');
var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;
你可以更简单地写:
var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
返回第一个有效的内部文档。
一旦获得了内部文档,就可以像访问当前页面上的任何元素一样访问其内部内容。(innerDoc.getElementById…等等)。
重要提示:确保iframe在相同的域中,否则您无法访问它的内部。这就是跨站点脚本编写。参考:
MDN: <iframe>脚本 MDN:同源策略:跨源脚本API访问
推荐文章
- 使伸缩项目正确浮动
- Babel 6改变了它导出默认值的方式
- 如何配置历史记录?
- ES6模板文字可以在运行时被替换(或重用)吗?
- [Vue警告]:找不到元素
- 可以在setInterval()内部调用clearInterval()吗?
- AngularJS控制器的生命周期是什么?
- 无法读取未定义的属性“msie”- jQuery工具
- 形式内联内的形式水平在twitter bootstrap?
- 我的蛋蛋怎么不见了?
- JavaScript中的排列?
- 自定义元素在HTML5中有效吗?
- JavaScript中有睡眠/暂停/等待功能吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?