iframe是vue的,在使用过程中高度根据数据实时变化,不好设置iframe的高度值。试了多种方式之后,总结了几种自适应的方式。
实时刷新iframe高度变化
var iframes = document.getElementsByTagName('iframe'); setInterval(function() { for (var i = 0, j = iframes.length; i < j; ++i) { iframes[i].setAttribute('height', iframes[i].contentWindow.document.body.scrollHeight); } }, 1000);
iframe高度有变的时候通知父级
// iframe this.$nextTick(()=>{ parent.window.iframeChangeHeight() })
// 父级 function iframeChangeHeight(){ var iframes = document.getElementsByTagName('iframe'); for (var i = 0, j = iframes.length; i < j; ++i) { iframes[i].setAttribute('height', iframes[i].contentWindow.document.body.scrollHeight); } }
iframe高度有变的时候直接修改iframe高度
function iframeChangeHeight(){ let iframes = window.parent.document.getElementsByTagName('iframe'); for (var i = 0, j = iframes.length; i < j; ++i) { iframes[i].setAttribute('height', iframes[i].contentWindow.document.body.scrollHeight) } },
发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/232913.html原文链接:https://javaforall.net
