index.html網頁代碼
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="target-densitydpi=medium-dpi,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<title>index</title>
</head>
<body style="background-color:#FFFFFF;">
<iframe src="iframe.html" style="width:200px;" scrolling="no"></iframe>
<iframe src="iframe.html" style="width:200px;" scrolling="no"></iframe>
</body>
</html>
iframe.html網頁代碼
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="target-densitydpi=medium-dpi,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<title>iframe網頁</title></style>
</head>
<body style="background-color:#CCCC00; height:1200px;">
<center>
<h1 style="color:#FFFFFF">
<a href="tencent://message/?uin=632175205&Menu=yes" class="qq" style="color:#666; text-decoration:none; font-size:13px;">QQ我632175205</a></h1>
</center>
</body>
<script>
var doc=window.parent.document;
var heightz=document.body.scrollHeight||document.documentElement.scrollHeight;
var iframes=doc.getElementsByTagName("iframe");//就是先獲取父頁的所有iframe
var cururl=String(window.location);
for(var i=0;i<iframes.length;i++){
if(iframes[i].src==cururl){ //然后比較他們的src是不是跟當前頁網址一樣
iframes[i].style.height=heightz+"px";//如一樣則更新高度
}
}
</script>
</html>
以上代碼可以實現自適應iframe高度
