JS method to implement iframe adaptive height (compatible with IE and FireFox)

This article describes the method of JS to implement iframe adaptive height. Share it for your reference, as follows:

I have been troubled by the high level of adaptability of iframes before, and a lot of JS code seems to be dumb in FF. Later, the following code was finally retrieved by me from the pile of codes that claim to be compatible with FF. I've used it, it's really easy to use. Especially for people like me who have a low level of JS (I'm so sorry), this code is simple and easy to understand and convenient to modify. Just copy and paste the following code into the <body> tag of the page where the iframe is located and modify the ID name (note that there are two places to be modified, and the location is explained in the code).

Salute to friends who created this code.

Step 1: Enter the following JS code under the <body> tag

&lt;scriptlanguage="javascript"&gt;
function adjustFrameSize()
{
  var frm = ("iframe1"); //Replace iframe1 with your ID name  var subWeb =  ? ["iframe1"].document : ;
  if(frm != null &amp;&amp; subWeb !=null)
  {
   ="0px";//Initialize it, otherwise the large page height will be retained    = +"px";
    = +"px";
   ="auto";
   ="auto";
  }
}
&lt;/script&gt;

Step 2: Add onload="adjustFrameSize()" to the iframe tag

For example:

Copy the codeThe code is as follows:

<iframe onload="adjustFrameSize()" scrolling="no" src=""width="100%" height="300px" target="_self"frameborder="0"></iframe>

This code has a small disadvantage, that is, the distance between the content in the iframe and the outer border (if there is an outer border) is a little small, so you can adjust it appropriately by yourself; in addition, no other browsers have been tested except IE6.0 or above and FF, and no other defects have been found. If you find problems during use or have a better solution, please share it.

If the iframe page contains ajax-loaded page or dynamically add content through js, you can add the following methods:

1: Add the following content to the subpage

//Modify the parent window addressfunction changeHeight(){
 = "#height=" + $(document).height();
}

Modify the part of the dom to call this method

2: Add the parent page

//High adaptivevar iframe = ("iframe1");
function iframeHeight() {
  var hash = (1), h;
  if (hash &amp;&amp; /height=/.test(hash)) {
    h = ("height=", "");
     = h+"px";
     = "#temp";//Prevent the height from being unchanged when clicking on other pages  }
  setTimeout(iframeHeight, 100);
}
iframeHeight();

For more information about JavaScript, readers who are interested in reading this site's special topic:Summary of json operation skills in JavaScript》、《Summary of JavaScript switching effects and techniques》、《Summary of JavaScript search algorithm skills》、《Summary of JavaScript animation special effects and techniques》、《Summary of JavaScript Errors and Debugging Skills》、《Summary of JavaScript data structure and algorithm techniques》、《JavaScript traversal algorithm and skills summary"and"Summary of JavaScript mathematical operations usage》

I hope this article will be helpful to everyone's JavaScript programming.