0

私は現在、知識のギャップを埋めるためにjQueryを読んでいます。

さまざまな CSS セレクターを見ると、次のことがわかります。

  • #C(ID が C の任意の要素)

    $('#profile')
    
  • E#C(#C の ID を持つタイプ E の任意の要素)。

    $('div#profile')
    

CSS ルールの適用において特異性が重要であることは知っていますが、ページに ID を重複させることは悪い習慣であることを考えると、なぜ 2 番目のフォームが存在し、jQuery でどのように扱われるのか疑問に思っています。

DOM に問い合わせるときにパフォーマンス上の利点が得られますか? (つまり、選択範囲を即座に制限します)。この質問は主にjQueryに当てはまりますが、レンダリングエンジンなどに関係があるかどうかも知りたいです.

4

2 に答える 2

3

jQuery には、フォームのセレクターを直接処理するための特殊な「高速パス」があります。フォームのセレクターはこのパスでは処理されず、代わりにSizzleライブラリに委譲されます。#Cdocument.getElementByIdE#C

E#Cしたがって、理論上もパフォーマンスが向上するという議論はありませんが、実際にパフォーマンス上の利点を提供する方法はわかりません。確かに、E#Cはるかに遅いです。ここで大きなパフォーマンスの違いを確認してください¹。

とはいえ、E#Cセレクターはもちろんより制限的であるため、選択がjQueryまたはその他の媒体によって行われるかどうかに関係なく、2つの動作は異なります。それでも、私は一度も使用したことがありませんE#C(または使用されているのを見たことがありません)。異なるページで ID を再利用する理由が思いつきません。


¹確かに、実際にはそのセレクターはループで実行されないため、パフォーマンスの違いは問題になりません。

于 2012-10-24T18:52:26.577 に答える
2

jQuery はボトムアップ検索を使用します。最後のセレクターから始まり、フィルターをかけます。

例:

$('#id1 .class1 .class2') は class2 のすべてのクラスを検索し、その結果を class1 の親を持つすべてのクラスに対してフィルター処理し、id1 の id を持つ親でさらにフィルター処理します

$('#profile') と $('div#profile') は本質的に同じで、ほぼミリ秒の分数です。しかし、パフォーマンス上の利点と、DOM を適切にトラバースする方法を知っておくとよいでしょう。

于 2012-10-24T18:51:47.913 に答える