摘要：如果在內(nèi)嵌頁面未載入完成時，給出一種加載提示信息。載入?yún)^(qū)域給出友好的提示信息當載入完成時，清空提示信息，而讓顯示這些都比較容易，但現(xiàn)在的問題的關鍵是怎么監(jiān)聽元素內(nèi)的頁面已經(jīng)載入完成。

經(jīng)常會遇到這樣一種情景：
在iframe里嵌入另外一個頁面時。如果iframe載入的頁面響應較快，或許我們感覺不到頁面載入的不同步，但試想，如果一個需要內(nèi)嵌到iframe里的頁面的響應很慢，這里會出現(xiàn)一種什么現(xiàn)象呢？這時將會出現(xiàn)所有頁面已經(jīng)載入完成，但在iframe元素處，將會出現(xiàn)空白，直到內(nèi)嵌頁面完成載入時，該空白處才會顯示新載入的頁面。

可想而知，一個頁面如果長時間的空白，對于瀏覽者來說將意味著什么。
如果在內(nèi)嵌頁面未載入完成時，給出一種加載提示信息。如：“頁面加載中”之類的，我想這對瀏覽頁面用戶來講，將不再是煎熬，更是一種視覺上的享受。

為了實現(xiàn)這樣的效果，一般會采用如下原理處理。

iframe載入?yún)^(qū)域給出友好的提示信息

當iframe載入完成時，清空提示信息，而讓iframe顯示

這些都比較容易，但現(xiàn)在的問題的關鍵是怎么監(jiān)聽iframe元素內(nèi)的頁面已經(jīng)載入完成。
關鍵這個問題，一般來講，會分兩種情況的來討論解決方案。

同域的嵌套。最好是讓子頁面調用父頁面的方法

如果是異域，但子頁面無法修改，那么：在Firefox/Opera/Safari中，可以直接使用iframe onload事件；而在IE中，可以通過定時器測定子頁面的document.readyState，或者使用iframe onreadystatechange事件計算該事件的響應

parent.html

function ifrmLoaded() {
    // code here
}
sub.html

window.onload = function() {
    window.parent.ifrmLoaded();
}

Firefox/Opera/Safari中直接使用iframe onload事件

document.getElementById("ifrm").onload = function() {
    //here doc
}

在IE下，注冊iframe onreadystatechange事件

var oFrm = document.getElementById("ifrm");
oFrm.onreadystatechange = function() {
    if (this.readyState && this.readyState == "complete") {
        onComplete();
    }
}

var oFrm = document.getElementById("ifrm");
oFrm.onload = oFrm.onreadystatechange = function() {
     if (this.readyState && this.readyState != "complete") return;
     else {
         onComplete();
     }
}

因為iframe默認是inline-block元素，空白符被解析，所以無端端出現(xiàn)滾動條
使用iframe時，一般會出現(xiàn)雙滾動條問題，解決方案如下：

1、修改