Iframe自适应高度_ie_firefox下都可用

最新推荐文章于 2020-11-20 10:03:00 发布

fdjcbl

最新推荐文章于 2020-11-20 10:03:00 发布

阅读量90

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： IE Firefox JavaScript ASP Opera ViewUI

本文链接：https://blog.youkuaiyun.com/fdjcbl/article/details/83401412

javascript 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一种使用JavaScript动态调整iframe元素高度的方法。通过检测iframe内部文档的高度，并将其设置为iframe的高度，确保内容完全显示且不出现多余空白。适用于不同浏览器环境，除了Opera。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns="http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe</title>
</head>
<body>
<script type="text/javascript">
function SetCwinHeight(){
var bobo=document.getElementById("bobo"); //iframe id
if (document.getElementById){
   if (bobo && !window.opera){
    if (bobo.contentDocument && bobo.contentDocument.body.offsetHeight){
     bobo.height = bobo.contentDocument.body.offsetHeight;
    }else if(bobo.Document && bobo.Document.body.scrollHeight){
     bobo.height = bobo.Document.body.scrollHeight;
    }
   }
}
}
</script>
<iframe width="100%" id="bobo" onload="Javascript:SetCwinHeight()" height="1" frameborder="0" src="/default.asp?cateID=1"></iframe>
这里写几个字试试！子鼠！
</body>
</html>