前端技術之Iframe

1.ifarme載入頁面後的高度問題：

主入口iframe載入本地頁面比如main.html的是可以撐開的，如果載入第三方是不能撐開的，除非給主頁面裡的iframe加上固定高度，或者通過js計算移動裝置的高度，給到主頁面裡的iframe上邊，**如下：

var hg = window.screen.height;
$(".iframe-content").css("height",hg+"px");

同時最好給主頁面裡的iframe

width="100%" height="100%"

2.頁面滑動時，滑動的內容實際上是iframe載入的頁面在滑動，不論是本地的main.html還是載入的第三方頁面，如果你想用滑動高度做點什麼，請用一下**

window.onscroll=function());
}

3.蘋果機出現無法滑動的情況，請用以下**

.iphone

4.頁面中iframe的跳轉實際上是它的srcs屬性在變化：

function loadtaburl(gourl,hpx)

這樣存在倆種情況：1）通過乙個iframe不斷載入其他頁面，如上；

2）外鏈出去，如下：

window.top.location.href = gourl;

5.在外部獲取iframe載入頁面的元素並操作

通過上面的**我們可以獲得id('external-frame'）iframe載入的main.html裡面的乙個class="aaa"的div元素，並且在頁面華東的時候，去控制它的css。

6.在iframe載入頁面的內部獲取父頁面的元素並操作

$(function() );

7.iframe載入的頁面與瀏覽器歷史記錄

iframe.contentwindow.location.replace(url) 這個在iframe裡跳轉頁面是不會有歷史記錄的

iframe.contentwindow.src = url; 這個會留下歷史記錄

window.history.pushstate()方法用於新新增一條歷史記錄例如：

window.history.pushstate({}, null, 'a.html');

第乙個引數和第二個引數可以傳入null，第三個引數就是需要變成的url位址，值得一提的是，這個位址必須是同源的。第乙個引數可以放入乙個物件，瀏覽器會將此物件變數標記到這個歷史記錄中，當從別的頁面再次回到這個頁面的時候，瀏覽器呼叫onpopstate事件將此變數當成引數傳入。

firefox：

如果iframe是靜態存在在html中時，iframe的任何src或者location改變都會被記錄到瀏覽器history中。

如果iframe是在頁面載入完成後動態建立的，那麼iframe的任何src或者location改變都不會被記錄到瀏覽器history中。

ie:

兩種iframe的src或者location改變都會被記錄到瀏覽器history中。

safari：

兩種iframe的src或者location改變都不會被記錄。