<!doctype html> <html> <head lang="en"> <meta charset="utf-8"> <title></title> </head> <body> <input type="button" value="页面1"/> <input type="button" value="页面2"/> <iframe id="iframepage" src="1.html" frameborder="0" scrolling="no"></iframe> </body> <script> // contentwindow所有浏览器支持,contentdocument ie不支持; window.parant当前页面的父页面,window.top当前页面的最外层页面 // iframe防钓鱼:if(window!=window.top){window.top.location.href=window.location.href} 如果最顶层页面不是当前页面,就把最顶层网址指向当前页面网址 window.onload=function(){ var oiframe=document.getelementbyid('iframepage'); var abtn=document.getelementsbytagname('input'); changeheight(); function changeheight(){ settimeout(function(){ //必须加一个延迟,不然高度改变会和页面加载冲突,事先不了高度变化 oiframe.height=oiframe.contentwindow.document.body.offsetheight; },100); } abtn[0].onclick=function(){ oiframe.src='1.html'; changeheight(); }; abtn[1].onclick=function(){ oiframe.src='2.html'; changeheight(); }; }; </script> </html>
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
以上就是用js操作iframe改变界面高度的详细内容。