如何从<iframe>中获得<div> ?
当前回答
其他的答案都对我不起作用。我最终在我的iframe中创建了一个函数,返回我正在寻找的对象:
function getElementWithinIframe() {
return document.getElementById('copy-sheet-form');
}
然后像这样调用该函数来检索元素:
var el = document.getElementById("iframeId").contentWindow.functionNameToCall();
其他回答
你可以使用这个函数来查询页面上的任何元素,不管它是否嵌套在一个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都必须是同源的,否则该函数将抛出错误。
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访问
下面的代码将帮助您找到iframe数据。
let iframe = document.getElementById('frameId');
let innerDoc = iframe.contentDocument || iframe.contentWindow.document;
如果iframe不在同一个域中,不能从父域访问它的内部,但可以修改iframe的源代码,那么可以修改iframe显示的页面以向父窗口发送消息,从而允许在页面之间共享信息。一些来源:
https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage Html5 -跨浏览器Iframe postmessage -子到父? 从子节点到父节点的postMessage
window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')
CallYourFunction()是页面内部的函数和它上面的函数动作
推荐文章
- 在React Native中使用Fetch授权头
- 为什么我的球(物体)没有缩小/消失?
- Twitter Bootstrap 3 Sticky Footer
- 如何使用jQuery检测页面的滚动位置
- if(key in object)或者if(object. hasownproperty (key)
- 一元加/数字(x)和parseFloat(x)之间的区别是什么?
- angularjs中的compile函数和link函数有什么区别
- 删除绑定中添加的事件监听器
- CSS在特定的“内联块”项之前/之后换行
- 很好的初学者教程socket.io?
- 点击下载Href图片链接
- HtmlSpecialChars在JavaScript中等价于什么?
- 我如何删除背景图像在css?
- 如何克服HTML表单嵌套的限制?
- React: 'Redirect'没有从' React -router-dom'中导出