1

私はいくつかのサイトを見てきましたが、それらはすべて、クラスの代わりにタグセレクターを使用してパフォーマンスを向上させることについて話しています。

たとえば、次のようになります。

$("input.myclass");

これの代わりに：

$(".myclass");

例えば：

彼らは全員、JavaScriptにはクラスを直接選択する方法しかなく、その方法はないgetElementByIdと主張しました。getElementsbyTagName

この3年間で変化はありましたか？クラスごとに選択できるようになりましたか？私はjsperfでそれをテストしていましたが、クラスセレクターがはるかに高速であるようです: http://jsperf.com/class-vs-input

私はまた、他の人のテストを見て、同じ結果を示しています: http://jsperf.com/selectors-perf/3

これは昨年これらで変化しましたか？タグではなくクラスで選択する必要がありますか? クラス セレクターをネイティブに実装しているブラウザーのバージョンはどこで確認できますか?

ありがとう。

4

1 に答える 1

2

今は変わりました。

ほとんどのブラウザは以下を実装しています:

var matches = document.body.querySelectorAll('div.highlighted > p');

JavaScript での実装の内部。

それが現在 jQuery が内部で使用しているものです。querySelector または通常の getElementsByTagName 関数のどちらを使用するかを選択するセレクター js ライブラリである sizzle.js を実装しています。

たとえば、jquery コンストラクター関数$() の場合、最初の引数が文字列 :$(iAmAString)の場合、文字列の最初の文字が a の#場合、jquery は を呼び出しますdocument.getElementById(iAmAString.substr(0))。そうでない場合は、ブラウザの互換性と文字列の複雑さに応じて、querySelector を呼び出すかどうかをシズルに処理させます。

など、他にもたくさんの素晴らしいもの。

基本関数を使用し、頻繁に使用されるセレクターをキャッシュして、要素を選択するときに最も正確であることは、この大きなチェーンを通過するときのチェックの数を減らし、チェーン全体を回避することさえできます。

一部の Web サイトでは、これにより、ユニコーンに乗った子猫の素晴らしい効果が生まれるという特別な効果がありました。

互換性サポートはこちら https://developer.mozilla.org/en-US/docs/Web/API/Element.querySelectorAll

于 2013-06-17T14:32:43.753 に答える