0

$(document).ready にループがあり、関数を呼び出して要素内のテキストの各スニペットを検索し、それをセレクターとして使用するテキストの配列をチェックします。

このコードは、FF、Chrome、IE9+ などで 100% 動作しますが、IE8 ではブラウザーがフリーズします。

var setText = function(value)
{
    if(typeof $('.item_name:contains("'+value+'")') != 'undefined'){
      // Do something, it still freezes with nothing set here.
    }
}

// In the real script there maybe upwards of 20 items in this array.
var item_list = new Array('a','b','c');

$(document).ready(function() 
{
    $.each(item_list, function(index, value) {
       setText(value); 
    });
});

setText 関数を無効にしましたが、正常に動作するため、ループではなく、:contains セレクターのようです。

なぜこうなった？他にどうすればこれを行うことができますか? HTMLコード自体を編集できません。

HTML マークアップの一部を jQuery で変更し、HTML を追加し、CSS 値を変更する必要がありますが、一意の識別子は「.item_name」内のテキストだけです。

これが実行されるとフリーズする問題のページには、「.item_name」の最大 3 つの個別のインスタンスが含まれます。検索文字列に応じて、そのいずれかがターゲットになる可能性があります。

jQuery 1.7.1 を使用していますが、これを更新できません。

if($('.item_name:contains("'+value+'")').length > 0){ // Also causes it to freeze.
4

1 に答える 1

0

これは、セレクターのパフォーマンスの問題のようです。

次の手順をお勧めします1. すべての要素を含むコンテナーの
ような ID を追加します 2. $('.item_name:contains("'+value+'")', $('#crazy-products') に変更します)id="crazy-products"item_name
$('.item_name:contains("'+value+'")')

IE8 以下にはdocument.getElementsByClassName実装がないため、ドキュメント内のすべての要素を調べて、指定されたフィルター条件が適用されているかどうかを確認します。フィルタ条件にコンテキストを渡すことができれば、ドキュメント ルックアップの範囲を狭めることができ、ページのパフォーマンスが向上します。

問題をよりよく理解するには、jquery.js の行番号 4215 ( found = filter( item, match, i, curLoop )) を見て、配列のサイズをcurLoop確認します。あなたのケースでは非常に大きいように見えます。id ベースのコンテキストをフィルターに渡すことで、それを減らすことができます。 .

于 2013-01-25T03:18:41.330 に答える