Warum wählt der jquery-Selektor ("id, id") alle Elemente mit doppelten IDs aus?

8

Ich stieß auf einen alten Code, der von einem guten Entwickler geschrieben wurde (ja, ich kannte ihn persönlich), um auf alle Elemente mit derselben ID zuzugreifen.

%Vor%

Es gibt alle Elemente mit der ID zurück. Aber wenn wir das unten verwenden

%Vor%

Es wird wie erwartet nur die erste Übereinstimmung zurückgegeben.

Nachdem ich einige Zeit gesucht habe, bin ich nicht in der Lage, irgendwelche offiziellen Links zu finden, die auf seine Technik zeigen, wie er alle Elemente mit doppelter ID ausgewählt hat.

Kann mir bitte jemand erklären, wie das funktioniert?

AKTUALISIEREN

Bitte sehen Sie sich die Frage nicht an, welche Alternative zu verwenden ist. Ich bin bewusst, classSelectors und attributeSelectors und wissen, doppelte IDs ist nicht zu empfehlen, aber manchmal müssen Sie nur mit Jahren alt Code so leben, wie es ist (wenn Sie wissen, was ich meine).

Ссылка

    
coding_idiot 04.06.2015, 06:36
quelle

4 Antworten

12

Wenn Sie sich den Code von sizzle.js ansehen jQuery verwendet für die Auswahl von Elementen basierend auf Selektor Sie verstehen, warum dies passiert. Es verwendet folgende Regex, um einfache ID-, TAG- oder Klassenselektoren zu finden:

%Vor%

Da der betreffende Selektor jedoch $("#ID,#ID") ist, stimmt er nicht mit dem Selektor überein und verwendet querySelectorAll (Zeile Nr. 270 in ref link), was den Selektor in "[id='" + nid + "'] " (Zeile Nr. 297 in ref link) ersetzt wählt alle Elemente mit übereinstimmender ID aus.

Allerdings stimme ich den anderen Leuten in diesem Thread zu, dass es keine gute Idee ist, dieselbe ID für mehrere Elemente zu haben.

    
Dharmesh Patel 04.06.2015 07:12
quelle
2

2 Elemente mit der gleichen ID zu haben, ist kein gültiger HTML-Code gemäß der W3C-Spezifikation.

Wenn Ihr CSS-Selektor nur über einen ID-Selektor verfügt (und nicht in einem bestimmten Kontext verwendet wird), verwendet jQuery die native document.getElementById-Methode, die nur das erste Element mit dieser ID zurückgibt.

In den anderen beiden Fällen jedoch hängt jQuery von der Sizzle-Selektor-Engine (oder querySelectorAll, falls verfügbar) ab, die beide Elemente scheinbar auswählt. Die Ergebnisse können je nach Browser variieren.

Sie sollten jedoch niemals zwei Elemente auf derselben Seite mit derselben ID haben. Wenn Sie es für Ihr CSS benötigen, verwenden Sie stattdessen eine Klasse.

Wenn Sie unbedingt eine doppelte ID auswählen müssen, verwenden Sie einen Attributselektor:

%Vor%

Sieh dir die Geige an: Ссылка

Hinweis: Wenn möglich, sollten Sie diesen Selektor mit einem Tag-Selektor wie folgt qualifizieren:

%Vor%     
Aabid 04.06.2015 06:54
quelle
-1

In JS Fiddle habe ich ein Beispiel dafür gezeigt, was jQuery macht.

Ссылка

Wenn Sie ein

haben %Vor%

Es werden tatsächlich alle Instanzen der Objekte #choice zweimal abgerufen und dann alle Duplikate herausgefiltert.

in meinem Beispiel zeige ich Ihnen, wie es das auch macht, wenn Sie so etwas haben

%Vor%

Wo

  • Elemente sind eigentlich Ihre # Auswahlelemente.

    In der Jquery-Dokumentation Ссылка

    Es spricht von mehreren Selektoren, was meiner Meinung nach hier passiert, Ihr Entwickler-Freund wählt dieselbe ID zweimal und würde sie zweimal zurückgeben. Da Sie auf einer Seite nur eine Eingabe mit derselben ID haben können (gute HTML-Syntax)

        
  • Robbie Tapping 04.06.2015 06:44
    quelle
    -2

    Du hast die ID auf der Seite dupliziert, wodurch dein HTML ungültig wird. ID ist eindeutiger Bezeichner für ein Element auf der Seite ( spec ). Verwenden Sie Klassen, die ähnliche Elemente klassifizieren, und $('.choice') gibt die Menge der Elemente zurück

        
    godblessstrawberry 04.06.2015 06:45
    quelle