16

私がいくつか持っているとしましょう

<TR style = "background-color : red ;">

いくつかの

<TR>

(コロンとセミコロンの隣のスペースは意図的なものであることに注意してください。私が扱っているページはそのように書かれているからです)

今、これ:

$('.detailtable tr:not([style~="darkgray"])')

完璧に動作します。しかし、ここでは次のように述べています。

[name!="value"] は、ネイティブ DOM querySelectorAll() メソッドによって提供されるパフォーマンス向上を利用できません。最新のブラウザでパフォーマンスを向上させるには、代わりに $("your-pure-css-selector").not('[name="value"]') を使用してください

だから私は疑問に思っていました:私の表現は最高のものですか、それとも次のようなものですか:

$('.detailtable tr').not('[style~="darkgray"]') // this doesn't work!

より良いパフォーマンスですか?そして、この最後の式を書く正しい方法は何ですか?

前もって感謝します

4

3 に答える 3

32

「属性内に文字列を含まない要素を選択する」ことが本当に必要な場合は、次のよう*=に の代わりに使用する必要があります。~=

$('.detailtable tr').not('[style*="darkgray"]');

これがフィドルです。


いいえ、使用.notはおそらく高速ではありません。querySelectorAllそのセレクターをそのまま解析できるはずです。

このフィドルを参照してください。


編集: IE8 をそれほど気にしている場合.notは、セレクターの代わりにメソッドを使用する:notと、パフォーマンスがわずかに向上します。この理由は非常に単純です。IE8 は属性セレクターをサポートしていますが、否定セレクターはサポートしていません。

于 2012-06-13T14:50:49.533 に答える
0

W3C勧告から、現在使用しているものは、を使用しても完全に正常に機能するはずdocument.querySelectorAll()です。

たぶん、それが期待どおりに機能するかどうかをテストできます。

于 2012-06-13T14:55:18.043 に答える
0

これをご覧になることをお勧めします。

興味深いことに、疑似セレクター( ":not"など)は、最初のセレクターの横にある関数を使用するよりも実際には遅くなる傾向があります。実際...彼らは明らかに「2倍遅い」です。

私は引用します:

  1. $("#id p");
  2. $("#id").find("p");

2番目の方法が最初の方法の2倍以上速くなる可能性があることを知って驚くでしょうか?どのセレクターが他のセレクターよりも優れているか(およびその理由)を知ることは、コードが適切に実行され、何かが起こるのを待っているユーザーを苛立たせないようにするための非常に重要な構成要素です。

.not友達と一緒に行きます!

于 2012-06-13T14:49:08.620 に答える