3

頻繁に操作される要素がたくさんある複雑なWebページがあります。これはChrome/FFで非常にスムーズに実行されますが、IE(8 + 9)はこのページで頻繁にフリーズするようです。

IEで他のブラウザよりも実行速度が非常に遅いコードの特定のセクションの1つは、ページに新しい要素を追加する場所です。具体的には、documentFragmentに追加する50個の(ネストされた)要素があり、最終的にはdocumentFragmentを実際のドキュメントの一部の要素に追加します。この最後の追加は、Chrome / FFでは高速で行われますが、IEでは数秒以上かかる場合があります。

私はhtml()/ innerHTMLを使用してみましたが、これは問題を悪化させるだけのようでした(要素を1つずつappend()するよりも良いかもしれませんが、documentFragmentは役立つようです)。質問は、私はそれについて何ができるかということです。これらの要素をIEに挿入するより効率的な方法はありますか?挿入が遅くなる原因となるものがありませんか?

ありがとう。


==編集==

コード例(1:1ではありませんが、これは私が一般的に参照していたものです):

function insertContent(elementsCollection)
{
    var fragment = document.createDocumentFragment();

    for (var i=0; i < elementsCollection.length; i++)
    {
        fragment.appendChild($(collection[i])[0]);
    }

    $("#parentDiv").append(fragment);
}
4

1 に答える 1

2

私はいつも使っています(そしてお勧めします)

rootNode.replaceChild(newElement, oldElement)

あなたがIE/FF/Chrome/Safariで言及したような問題には直面しませんでした。一度にアクティブな DOM ツリー ノードを構築するのではなく、新しいドキュメント フラグメントを個別に準備し、既存のノードを一度に新しいノードに置き換えます。

于 2012-07-25T11:37:36.263 に答える