sélecteur descendant parent jquery

Question

Pourquoi est-1 plus vite que 2?

1. $('#p1').find('span');
2. $('#p1 span');

Answer 1

Dans jQuery 1.4 le sélecteur est vérifié si elle est un sélecteur de id (comme votre #p1).

• S'il est en effet, la document.getElementId(...) est appelée et le résultat est enveloppé dans l'objet utilitaire jQuery et retourné.
• Si elle est autre chose que cela, les appels jQuery Sizzle qui fait alors ce qu'il fait pour trouver les éléments. Et, à en juger de la source, c'est à peu des choses non trivial.

Answer 2

La meilleure façon est de tester!

A partir de ce simple test:

• Contenu - ​<p id="p1"><span>Test</span></p>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
• Looping 100.000 fois

• Version: jQuery 1.4.2

• $('#p1').find('span');: 2601ms

• $('#p1 span');: 1998ms

Il semble que le sélecteur unique est plus rapide dans ce cas, puisque vous n'êtes pas faire autant d'appels à travers jQuery ce sens.

Lui donner un essai ici, regardez votre console.

---

cae vous êtes sur jQuery 1.3.2 voici les résultats:

• $('#p1').find('span');: 3225ms
• $('#p1 span');: 2082ms

essayer avec 1.3.2 .

Answer 3

Dans votre cas, peut-être # 1 est plus rapide que n ° 2, mais selon le nombre d'itérations et le nombre d'éléments de recherche, n ° 2 pourrait très bien être plus rapide que # 1 dans d'autres scénarios.

Je .: par exemple suppose que si vous aviez 3 éléments span et pas d'autres éléments dans #p1, puis # 1 serait plus rapide que # 2, puisque trouver ne cherche pas à faire comme correspondant beaucoup CSS. Mais, si vous aviez 1000 éléments span, avec 2000 autres éléments #p1, je parierai # 2 serait plus rapide, car il ne dispose pas d'itérer sur chaque élément deux fois.