关于iframe自适应高度小记
最近项目中遇到加载 iframe 标签,要求iframe根据内容自己调整高度,小研究了一下,发现这个方法蛮好用,小记一下.
针对单个iframe
[javascript]
window.onload = function(){
var iframePage = document.getElementById('iframePage');
if(iframePage.contentDocument){
iframePage.height = iframePage.contentDocument.body.offsetHeight + 35;
} else {
iframePage.height = iframePage.contentWindow.document.body.scrollHeight;
}
}
[/javascript]
针对同一页面多个iframe
[javascript]
function doIframe(){
o = document.getElementsByTagName('iframe');
for(i=0;i<o.length;i++){
if (/\autoHeight\b/.test(o[i].className)){
setHeight(o[i]);
addEvent(o[i],'load', doIframe);
}
}
}
function setHeight(e){
if(e.contentDocument){
e.height = e.contentDocument.body.offsetHeight + 35;
} else {
e.height = e.contentWindow.document.body.scrollHeight;
}
}
function addEvent(obj, evType, fn){
if(obj.addEventListener){
obj.addEventListener(evType, fn,false);
return true;
} else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
} else {
return false;
}
}
if (document.getElementById && document.createTextNode){
addEvent(window,'load', doIframe);
}
[/javascript]
