iframe在實際開發中應該算是比較常見的，在一些情況下iframe的高度是不確定，甚至是時時變化的
一般這種情況會有下面幾種情況：
1、父頁面和iframe頁面在同一個域下，這種情況最好解決。在iframe頁面里通過window.parent即可定位到父頁面的window對象，然后，通過定時器來檢測iframe頁面的高度變化，來設置父頁面的相應容器的高度即可。
實例代碼：
父頁面：
1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <iframe src="iframe.html" id="if" frameborder="0"></iframe> 9 </body> 10 </html>
子頁面：
1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body style="background:red"> 8 <script type="text/javascript"> 9 (function(){ 10 var doc = document, 11 //獲取父頁面的容器 12 par = window.parent.document.getElementById('if'), 13 body = doc.body, 14 div,height; 15 setTimeout(function (){ 16 div = doc.createElement('br'); 17 body.appendChild(div); 18 //當前頁面的高度 19 height = body.offsetHeight; 20 //設置容器高度 21 par.style.height=height + 'px'; 22 //定時來執行 23 setTimeout(arguments.callee,300); 24 },100); 25 })(); 26 </script> 27 </body> 28 </html>
2、父頁面和子頁面不在同一個域下。這種情況下，基於安全性的考慮，一些瀏覽器中通過window.parent就訪問不到父頁面的window對象，解決辦法如下：
①在iframe里面B添加一個隱藏的iframe標簽；
②iframe引用的文件C是和父頁面在同一個域下面的；
③通過循環來檢測B頁面上中height的高度 ，並且設置給隱藏的iframe標簽的地址中作為參數；
④在iframe頁面c中也設置一個定時器來讀取地址的值，可以獲取b頁面的高度；
⑤c頁面可以通過window.parent訪問到父頁面的window對象，並設置相應容器的高度
實例代碼：
父頁面：
1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <div value="1"> 9 <iframe id="aaa" src="http://edsn.sinaapp.com/demo/iframe/b.html" frameborder="2px"></iframe> 10 </div> 11 </body> 12 </html>
b頁面
1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body style="background:red"> 8 <iframe id="p" src="http://sirzxj.sinaapp.com/iframe/2/c.html#" style="display:none" frameborder="2px"></iframe> 9 <script type="text/javascript"> 10 (function(){ 11 var doc = document, 12 body = doc.body, 13 g = doc.getElementById('p'), 14 src = g.src.split('#')[0] + '#', 15 br,height; 16 setTimeout(function(){ 17 br = doc.createElement('br'); 18 body.appendChild(br); 19 height = doc.body.offsetHeight; 20 g.src= src + height; 21 setTimeout(arguments.callee,500); 22 },500); 23 //alert() 24 g.src += 'abc'; 25 })() 26 </script> 27 </body> 28 </html>
c頁面：
1 <!DOCTYPE HTML> 2 <html lang="en-US"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 (function(){ 10 var tops = window.top.document.getElementById('aaa'); 11 setTimeout(function(){ 12 var loc = window.location.href.split('#')[1]; 13 tops.style.height = loc +'px'; 14 setTimeout(arguments.callee,500); 15 },500); 16 })() 17 </script> 18 </body> 19 </html>
3，當子頁面的iframe不同域，且無法操控時，即不能夠在里面添加代碼時候，是沒有辦法實現高度自適應的