Was ist der Unterschied zwischen der Rückkehr von webkit '$$' und jQuery '$' return?

8

Wenn ich in einem Webkit-Browser wie Chrome Folgendes mache:

%Vor%

Ich bekomme ein Ergebnis, das fast genau so aussieht wie jQuery's:

%Vor%

Wenn ich in der Konsole nach der Definition von $$ suche, bekomme ich:

%Vor%

Und für $ bekomme ich:

%Vor%

Welche Art von Funktionen kann ich für ein $$ -Objekt ausführen, das ich nicht wirklich mit einem jQuery ( $ ) -Objekt ausführen kann?

    
Neal 06.07.2011, 17:46
quelle

6 Antworten

3

Da $$ nur ein Wrapper für querySelectorAll ist, können Sie alle gültigen Selektoren übergeben.

  

"Welche Art von Funktionen kann ich für ein $$ -Objekt ausführen, das ich nicht wirklich mit einem jQuery ($) -Objekt ausführen kann?"

Zunächst ist $$ kein Objekt wie jQuery. It ist ein Objekt, aber es ist nur ein einfaches Funktionsobjekt, das ein Wrapper (Verknüpfung) für document.querySelectorAll ist. Es gibt NodeList der gefundenen Elemente zurück.

Die einzige Sache, die unterstützt wird, die Sizzle nicht ausdrücklich unterstützt, ist meines Wissens :nth-of-type .

(Sizzle gibt standardmäßig qsa vor, wenn Sie einen gültigen Selektor angeben, sodass Sie nth-of-type an die jQuery-Funktion in Browsern übergeben können, die auch qsa unterstützen.)

Bei Sizzle gibt es mehrere Selektoren, die nicht von querySelectorAll unterstützt werden, sodass Sie mit jQuery / Sizzle technisch mehr erreichen können.

Dazu gehören:

  • :eq()
  • :gt()
  • :lt()
  • :first
  • :last
  • :not() (Wenn Sie mehrere Selektoren angeben. Einfache :not() -Werte werden in qsa unterstützt.)
  • :animated
  • :input
  • :button
  • :checkbox
  • :even
  • :odd
  • :has()
  • :image
  • :password
  • :radio
  • :reset
  • :selected
  • :submit
  • :text
  • :visible

... um einige mehrere zu nennen.

Denken Sie daran, dass Sizzle zuerst versucht, querySelectorAll zu verwenden. Wenn Sie einen proprietären Selektor übergeben haben, wird standardmäßig Sizzles eigene Engine verwendet.

Da qsa normalerweise schneller ist als Sizzle, kann es ratsam sein, Alternativen zu den oben aufgeführten proprietären Selektoren zu berücksichtigen, um die Leistung zu verbessern.

Beachten Sie auch, dass Webkit nicht für $$ anywhere außer in der Konsole definiert ist. Die Verknüpfung $$ ist in Ihren Skripten nur verfügbar, wenn Sie sie verfügbar machen.

    
user113716 06.07.2011, 17:57
quelle
7

$$ ist, wie Sie sagten, webkit-spezifisch und sollte nur wirklich in der Konsole verwendet werden. Es hat sehr ähnliche Selektoren wie jQuery, mit dem Unterschied, dass es ein Array von DOM-Knoten zurückgibt, während jQuery ein jQuery zurückgibt Array

Diese beiden sind identisch:

%Vor%

jQuery-Selektoren sind tatsächlich ein bisschen leistungsfähiger, da sie Selektoren hinzufügen, die nicht im Dom existieren, wie :checkbox , :contains , etc.

Referenz: JQuery-Selektoren

    
Mark Kahn 06.07.2011 17:50
quelle
4

WebKit definiert $$ und $ standardmäßig als Kurzbezüge auf document.querySelectorAll . Wenn jQuery geladen wird, ersetzt es den Wert von $ durch die jQuery-Funktion. jQuery behält auch den ursprünglichen $ -Wert bei, wenn Sie ihn benötigen. WebKit tut dies, um eine konsistente API für die Abfrage des DOM einzuführen, unabhängig davon, ob Sie jQuery verwenden oder nicht.

Der große Unterschied ist, dass das Ergebnis von querySelectorAll ein Array von DOM-Elementen ist (eine NodeList - danke @lonesomeday), während jQuery's das jQuery-Objekt ist.

    
Matthew Abbott 06.07.2011 17:53
quelle
2

Wenn Sie auf die Seite mit Chrome-Entwicklertools gehen, sieht es so aus, als würden die Entwicklerwerkzeuge von Chrome Die Befehlszeilen-API von Firebug (was bedeutet, dass Firebug auch $$ unterstützt).

Die Dokumentation für $$ lautet:

  

$$ (Selektor)

     

Liefert ein Array von   Elemente, die dem angegebenen CSS entsprechen   Selektor.

Dies entspricht in etwa jQuery(selector) , wobei selector ein CSS-Selektor ist und die Rückgabetypen offensichtlich anders sind. Kurz gesagt, es gibt wahrscheinlich nichts, was Sie speziell mit $$ tun können, aber wenn Sie über die Befehlszeilen-API von Firebug schauen, sieht es so aus, als gäbe es einige nützliche Funktionen (besonders wenn jQuery nicht auf der Seite verfügbar ist) / p>     

Andrew Whitaker 06.07.2011 17:53
quelle
2

Hier ist mein Teil. Bei der Recherche habe ich das von Safari docs Debugging your WebSite bekommen

Der Abschnitt Die Befehlszeilen-API sagt dies.

  

Zusätzlich zum üblichen JavaScript   Methoden und die Funktionen und   Variablen definiert in Ihrem Skript, Sie   kann eine Firebug-Befehlszeile eingeben   APIs interaktiv an der Konsole.   Die folgenden Befehle werden unterstützt   interaktiv:

     

$ 0- $ 4
  Variablen, die das enthalten   aktuelle und vorherige drei ausgewählt   Knoten im Web Inspector.

     

$ (id)
  Gibt das Element mit dem zurück   angegebene ID. Ähnlich zu   getElementById ().

     

$$ (Selektor)
  Gibt das Array von zurück   Elemente, die dem angegebenen CSS entsprechen   Wähler. Ähnlich wie querySelectorAll.

     

$ x (xpfad)
  Gibt das Array von zurück   Elemente, die dem angegebenen XPath entsprechen   Ausdruck.

    
naveen 06.07.2011 17:59
quelle
1

Wie Ihre Frage zeigt, ist $$ ein Wrapper um document.querySelectorAll . Dies bedeutet, dass es dieselben Optionen hat, wenn Sie es aufrufen und dasselbe zurückgibt.

Die Unterschiede zu $ (jQuery):

  • $$ unterstützt CSS-Selektoren, die vom Browser unterstützt werden. $ verwendet querySelectorAll , wenn es möglich ist, aber es unterstützt auch einige benutzerdefinierte Erweiterungen (z. B. :has ). Diese sind nicht verfügbar mit $$ .
  • $$ gibt eine statische NodeList zurück. Dies ist keine besonders nützliche Kreatur. Es verhält sich ein wenig wie ein Array (es hat eine length -Eigenschaft und Sie können auf seine Mitglieder mit [0] etc zugreifen), aber keine der normalen Array-Methoden wird verfügbar sein. jQuery wird geschrieben, um ein Objekt bereitzustellen, das die gefundenen Elemente umschließt, und es gibt viele bequeme Methoden. Keine davon wird im Ergebnis von $$ .
  • vorkommen
  • $$ wird die schnellste Option sein, so ziemlich immer. $ wird fast immer langsamer sein und wird oft viel langsamer sein.

Beachten Sie, dass die Chrome-Konsole das Ergebnis von $ und das Ergebnis von $$ so anzeigt, als wären sie Arrays. Weder ist es; Sie werden nur wie Arrays angezeigt, weil dies eine einfache Möglichkeit ist, sie zu konzeptionieren. $$ gibt ein NodeList , $ ein benutzerdefiniertes Objekt zurück.

    
lonesomeday 06.07.2011 17:57
quelle

Tags und Links