20

このコードを継承しましたが、ウィンドウ オブジェクトとドキュメント オブジェクトの両方にイベント リスナーを追加しているため、最適ではなく、正しくない可能性があります。ただし、blackberry 5.0 以外は正常に動作しています。これがすべて正しく設定されているか、またはそれを改善および/またはより合理化するための推奨事項があるかどうか、誰かが説明できますか?

        if (document.readyState === "complete") 
            callback();
        else if (document.addEventListener) 
        {
            document.addEventListener("DOMContentLoaded",callback,false);
            window.addEventListener("load",callback,false);
        }
        else if(window.attachEvent) 
        {
            document.attachEvent("onreadystatechange", callback);
            window.attachEvent("onLoad",callback);
        } else
            setTimeout(callback,2000);
4

3 に答える 3

62

それがどのように行われるかを知りたい場合、またはそれを行う方法を見たい場合。ディエゴ・ペリーニの作品を見ることをお勧めします。彼の作品とメソッドは、jQuery を含む多くの DOM ライブラリで使用されています。残念ながら、その男はあまり信用されていないようです。彼は、try/catch ポーリング方式の先駆者です。これにより、IE がミックスに投入されたときに、クロスブラウザーの DOM ロード イベントが可能になります。

https://github.com/dperini/ContentLoaded/blob/master/src/contentloaded.js

于 2011-08-01T17:58:43.270 に答える
5

純粋な JavaScript を使用する場合は、次のクロスブラウザー関数を使用できます (ソース (ロシア語): http://javascript.ru/unsorted/top-10-functions )

function bindReady(handler){
    var called = false     
    function ready() {
        if (called) return
        called = true
        handler()
    }     
    if ( document.addEventListener ) {
        document.addEventListener( "DOMContentLoaded", function(){
            ready()
        }, false )
    } else if ( document.attachEvent ) { 
        if ( document.documentElement.doScroll && window == window.top ) {
            function tryScroll(){
                if (called) return
                if (!document.body) return
                try {
                    document.documentElement.doScroll("left")
                    ready()
                } catch(e) {
                    setTimeout(tryScroll, 0)
                }
            }
            tryScroll()
        }
        document.attachEvent("onreadystatechange", function(){     
            if ( document.readyState === "complete" ) {
                ready()
            }
        })
    }
    if (window.addEventListener)
        window.addEventListener('load', ready, false)
    else if (window.attachEvent)
        window.attachEvent('onload', ready)
    /*  else  // use this 'else' statement for very old browsers :)
        window.onload=ready
    */
}
readyList = []      
function onReady(handler) {  
    if (!readyList.length) { 
        bindReady(function() { 
            for(var i=0; i<readyList.length; i++) { 
                readyList[i]() 
            } 
        }) 
    }   
    readyList.push(handler) 
}

使用法：

onReady(function() {
  // ... 
})
于 2011-08-01T18:01:46.323 に答える
3

個人的には、これにはjQueryを使用します。

jQueryは、ドキュメントの準備完了状態のさまざまなブラウザーの実装を処理するように設計されています。

jQueryを使用すると、上記のコードは次のようになります。

$(callback);
于 2011-08-01T17:48:35.817 に答える