JS动态修改iframe高度和宽度的方法/iframe 去除边框和自适应高度 – js/jQuery – 前端，jquery 提交多条数据

以下是js代码：

<scripttype="text/javascript">
functionreinitIframe(){
variframe=document.getElementById("frame");
try{
varbHeight=iframe.contentWindow.document.body.scrollHeight;

vardHeight=iframe.contentWindow.document.documentElement.scrollHeight;

varheight=Math.max(bHeight,dHeight);

iframe.height=height;

}catch(ex){}

}
window.setInterval("reinitIframe()",200);
</script>

方法三：js控制iframe的高度/宽度，自适应内容

页面使用方法：
<iframename="ifr_show"id="ifr_show"src="#"marginwidth="0"marginheight="0"frameborder="0"scrolling="no"width="100%"onload="IFrameReSize('ifr_show');"></iframe>
JS:
<scriptlanguage="javascript"type="text/javascript">
functionIFrameReSize(iframename){
varpTar=document.getElementByIdx_x(iframename);
if(pTar){
//iframe高度自适应
if(pTar.contentDocument&&pTar.contentDocument.body.offsetHeight){
pTar.height=pTar.contentDocument.body.offsetHeight;
}elseif(pTar.Document&&pTar.Document.body.scrollHeight){
pTar.height=pTar.Document.body.scrollHeight;
}
//iframe宽度自适应
if(pTar.contentDocument&&pTar.contentDocument.body.offsetWidth){
pTar.width=pTar.contentDocument.body.offsetWidth;
}elseif(pTar.Document&&pTar.Document.body.scrollWidth){
pTar.width=pTar.Document.body.scrollWidth;
}
}
}
</script>

方法四：html5移动端引入优酷视频iframe自适应

<iframeheight=498width=510src="http://player.youku.com/embed/XMTI4MjU5OTA3Mg=="frameborder=0allowfullscreen></iframe>

css里设置iframe的宽度为100%

根据屏幕宽度自适应，这里偶设定视频16/9的固定比例

window.onload=window.onresize=function(){
resizeIframe();
}
varresizeIframe=function(){
varbodyw=document.body.clientWidth;
for(varilength=0;ilength<=document.getElementsByTagName("iframe").length;ilength++){
document.getElementsByTagName("iframe")[ilength].height=bodyw*9/16;//设定高度
}
}