我們根據不同的單擊焦點在同一個iframe中打開不同的網頁時，往往都需要去動態的改變iframe的大小。我們都知道去改變它的height,但是往往得不到想要的效果。先說說幾種實現的方法：
首先，觸發轉到子頁面的函數，這個我們需要改變iframe的src的值，可以寫在click事件或者mouseover事件或者mousedown事件等等中。
var iframe1 = window.parent.document.getElementById("iframeID");
iframe1.src="要轉到的子頁面";
接下在就是在改變子頁面的大小。這里分為兩種（我知道的）：在觸發轉到子頁面的頁面寫，還有一種是直接在子頁面寫。
一、在觸發轉到子頁面的頁面寫，據我所知，這種方法可以實現，但是沒有第二種好，使用條件有限
在用jquery時，我們知道它是在頁面加載時先加載jquery,然后加載其它內容，我們在觸發一個事件時，只是改變了緩存中的值，要在觸發第二個事件時，第一次觸發的值才會真正的顯示出來。那么只用一個click去觸發，只能轉到子頁面，但是不能改變iframe的大小，這里，我用兩個函數去觸發，mousedown和mouseup
例：$("#buttonID").mousedown(function(){
//轉到子頁面的函數
resizeFrame();//改變大小的
})
.mouseup(function(){
resizeFrame();//將緩存中修改的值顯示到頁面，即實現iframe大小改變的效果
})
但是，這種方法有一定的缺陷，因為響應函數是需要一定的時間的，不同的瀏覽器相應的時間不同，這樣會照成鼠標單擊過快而使mouseup()函數來不及相應。
二、直接在子頁面寫改變iframe大小的函數，這種方法可以避免第一種響應時間的問題
在子頁面中的javascript中加入
function resizeFrame(){
//改變iframe大小的代碼
}
然后在頁面加載時觸發<body onload="return resizeFrame()">
接下來說改變iframe大小的函數
1、我的方法是：
function resizeFrame(){
var content_iframe = window.parent.document.getElementById("iframeID");//獲取iframeID
var div_height = parseInt($(content_iframe).contents().find("子網頁ID").css("height"));//使iframe高度等於子網頁高度
content_iframe.height = div_height + 100;
}
在網上有人說可以不用獲取iframe的ID，也不用獲取子網頁的ID，但是這種方法我用了一下，沒有打到預期的效果
function resizeFrame(){
frameElement.width = document.documentElement.clientWidth;
frameElement.height= document.documentElement.clientHeight;
}