0

指定された時間が経過した後にループをキャッチする関数を作成しました。

var t1 = new Date().getTime();
while(true){
    //general code in here...

    document.body.appendChild(document.createElement('div')); //This causes the problem

    if(isInfinite(t1,3000)){
        alert('Loop stopped after 3 seconds')
        break;
    }       
}


function isInfinite(t1,timeLimit){
    var t2 = new Date().getTime();
    if(t2-t1> timeLimit){
        return true;
    }
    else return false;
}

期待どおりに動作しますが、ドキュメントにノードを追加しようとすると、クロムとサファリでキャッチできません。奇妙なのは、デバッガーを実行しているときに機能し、FF で機能することです。これは何が原因ですか？

4

1 に答える 1

0

DOM の準備が整う前に、この JS コードを起動している可能性があります。これが私の実装です。

<!--Basically I am firing this script with onload event function.-->
<html>
    <head></head>
    <body onload="init()">
        <script>
            function init() {
                alert("asg");
                var t1 = new Date().getTime();
                while(true) {
                    //general code in here...
                    document.body.appendChild(document.createElement('div')); //This causes the problem
                    if(isInfinite(t1, 3000)) {
                        alert('Loop stopped after 3 seconds')
                        break;
                    }
                }

                function isInfinite(t1, timeLimit) {
                    var t2 = new Date().getTime();
                    if(t2 - t1 > timeLimit) {
                        return truite;
                    } else return false;
                }
            }
        </script>
    </body>
</html>

ただし、このスクリプトは、ブラウザーの製造元がループに対する制限をどのように設定しているかによって、クラッシュする可能性が高くなります (これは通常、メイン スレッドがブロックされている場合に発生します)。したがって、この例では setTimeout 関数を使用する方がはるかに良いと思います。

あなたの興味のためだけに

Javascript はイベント ベースで、スレッドは 1 つしかありません。あなたはそれを初心者に見せようとしていると言いました。このようにするのではなく、JS のイベントベースの性質を説明してみませんか?

于 2013-03-24T07:02:17.410 に答える