需求描述: 最近,项目中遇到iframe引入页面,并给iframe内部全部元素注册点击事件得需求。html
在注册事件以前,首先咱们要获取iframe内部元素。跨域问题已被后端老哥解决。后端
最初的想法: 项目采用VUE,想法是在nextTick钩子里面获取到iframe的内部dom.事实上,在最简单的状况下,也就是iframe内部没有其余iframe元素时能够成功。若是iframe内部嵌套多个iframe,此时并不能注册成功,暂时解决方法就是定时器轮询,功能实现却是能够,可是做为最终么有办法的方案。跨域
解决方法: 后来找到,iframe自带有load方法,在iframe加载完成后执行的钩子。bash
多说无益,贴代码dom
html:
<iframe id="ifra" name="ifra" width="100%" height="500" src="http://xxxxx">
</iframe>
复制代码
mounted() {
const self = this
this.$nextTick(() =>{
const iframe = document.querySelector('#ifra')
if (iframe.attachEvent) {
iframe.attachEvent("onload", function() {
const iframeNode = window.frames["ifra"].document
self.getDom(iframeNode)
});
} else {
iframe.onload = function() {
const iframeNode = window.frames["ifra"].document
self.getDom(iframeNode)
};
}
})
}
复制代码