7

これらのどれがより効率的であるかを誰かが知っているかどうか知りたいです。私はブラウザとしてのFirefoxにのみ関心があり、このコードがIEなどで機能しないことを知る必要はありません...

基本的に、入力フィールドの値に基づいてDOM要素を表示および非表示にします。必要に応じて、インスタント検索を実行します。検索結果が表示されない場合は、「何も見つかりません」要素を表示または非表示にする必要があります。クラス属性を変更する前に「nothingfound」要素が適切な状態にあるかどうかを確認する方が安価（より効率的）であるか、または単にクラス属性を変更する方がよいかどうかが気になります。

質問：要素のクラス属性に変更がない場合でも、関数を実行するたびに非表示のクラスを削除/追加する必要がありますか？

if (shown_count > 0) {
    element.classList.add('hidden');
}
else {
    element.classList.remove('hidden');
}

または、実際に要素を更新する前に、要素のクラス属性を更新する必要があるかどうかを確認する必要がありますか？

if (shown_count > 0) {
    if (element.classList.contains('hidden') == false) {
         element.classList.add('hidden');
    }
}
else {
    if (element.classList.contains('hidden')) {
         element.classList.remove('hidden');
    }
}
4

2 に答える 2

7

存在チェックはネイティブコードで既に行われていると思いますので、再度チェックする必要はありません。

それでは、ソースコードを見てみましょう（注：オブジェクトclassListです）DOMTokenList

String DOMTokenList::addToken(const AtomicString& input, const AtomicString& token)
{
    if (input.isEmpty())
        return token;

    StringBuilder builder;
    builder.append(input);
    if (input[input.length()-1] != ' ')   // <--- check happens here
        builder.append(' ');
    builder.append(token);
    return builder.toString();
}

ソースはWebKitのWebCoreから来ています

于 2012-10-17T15:37:08.687 に答える
2

jsperfでいくつかのテストを実行した後の答えは、最初のオプションの方が速いということです。xdazzの回答が原因である可能性がありますが、classList.addメソッドはすでにチェックを実行しています。

パフォーマンステストへのリンクは次のとおりです。http：//jsperf.com/add-remove-class-performanci

于 2012-10-17T16:22:48.933 に答える