Home > Article > Web Front-end > JavaScript method to implement frame height changing with content_javascript skills
The example in this article describes the method of using JavaScript to change the height of the frame with the content. Share it with everyone for your reference. The details are as follows:
There are two methods:
1. Change through the parent page
Here we need to understand the two attributes of the framework, contentWindow and contentDocument. The meaning of these two attributes is similar to that of window document. The difference is that contentWindow is supported by all browsers, but contentDocument is not supported by ie6 and 7, nor is chrome.
<iframe onload="change_height()"></iframe> function change_height(){ var iframe=document.getElementById("iframe_id"); //取得框架元素 var i_height=iframe.contentWindow.document.body.scrollHeight||iframe.contentWindow.document.documentElement.scrollHeight; //取得框架内容的高度 iframe.height=i_height; //改变 }
Second, through content changes
Proceed on the content page
window.onload=function(){ var iframe=parent.document.getElementById("iframe_id"); //取得框架元素 iframe.height=document.body.scrollHeight||document.documentElement.scrollHeight; //取得框架内容的高度并改变 }
I hope this article will be helpful to everyone’s JavaScript programming design.