Wie wähle ich alle Elemente mit einer bestimmten ID in jQuery aus?

76

Ich versuche, alle <div>s mit derselben ID in jQuery auszuwählen . Wie mache ich es?

Ich habe es versucht und es hat nicht funktioniert

jQuery('#xx').each(function(ind,obj){
      //do stuff;
});
jquery css-selectors Kennzeichen
quelle
20
IDs sollen eindeutig sein. Verwenden Sie Klassen.
Antony Carthy
25
Jeder weiß das, aber niemand hier hat seine Frage beantwortet.
Sid
4
Nicht immer kann man eindeutige IDs haben, zumindest kann ich mir das nicht immer leisten. Nun, @mydoghasworms hat die Frage [1] ziemlich gut auf den Punkt gebracht. [1]: stackoverflow.com/questions/902839/…
Fr0zenFyr

Antworten:

38

Ich würde verschiedene IDs verwenden, aber jedem DIV dieselbe Klasse zuweisen.

<div id="c-1" class="countdown"></div>
<div id="c-2" class="countdown"></div>

Dies hat auch den zusätzlichen Vorteil, dass die IDs basierend auf der Rückgabe von jQuery ('. Countdown'). Länge rekonstruiert werden können

Ok, was ist mit dem Hinzufügen mehrerer Klassen zu jedem Countdown-Timer? IE:

<div class="countdown c-1"></div>
<div class="countdown c-2"></div>
<div class="countdown c-1"></div>

Auf diese Weise erhalten Sie das Beste aus beiden Welten. Es erlaubt sogar die Wiederholung von 'IDS'

Ballsacian1
quelle
Ballasacian: Ich habe n Zähler mit den IDs 1..n, also habe ich für jeden ID = c-1, ID = c-2 usw., aber einige davon wiederholen sich. Daher kann ich Ihre Methode nicht verwenden. und sie haben alle die gleiche Klasse = 'Countdown' danke
Markieren Sie
Warum soll es sich wiederholen? Besonders auf einer ID, die eindeutig sein muss.
Ballsacian1
Ballasacian: Danke! das war genial! funktioniert so wie ich will !! Ich weiß nicht, warum ich vorher nicht daran gedacht habe!
Markieren Sie
1
Es ist wichtig, eine vollständige Antwort zu haben, die die Voraussetzungen voraussetzt und keine Problemumgehung darstellt. Selbst wenn Sie der Meinung sind, dass die Voraussetzungen nicht optimal sind, sind sie häufig eine Selbstverständlichkeit (wie das Schreiben eines Greasemonkey-Skripts für eine vorhandene Website, die auf diese Weise ID-Tags verwendet).
Shiggity
Dies sollte nicht die akzeptierte Antwort sein. Es gibt Fälle (zum Beispiel ein Greasemonkey-Skript), in denen man keine Kontrolle über das HTML hat, und es gibt definitiv Websites, die dieselbe ID mehrmals verwenden.
Blues
401

Obwohl es hier andere richtige Antworten gibt (z. B. die Verwendung von Klassen), ist es aus akademischer Sicht natürlich möglich, mehrere Divs mit derselben ID zu haben, und es ist möglich, sie mit jQuery auszuwählen.

Wenn Sie verwenden 

jQuery("#elemid")

Es wird nur das erste Element mit der angegebenen ID ausgewählt.

Wenn Sie jedoch nach Attribut auswählen (z. B. ID in Ihrem Fall), werden alle übereinstimmenden Elemente wie folgt zurückgegeben:

jQuery("[id=elemid]")

Dies funktioniert natürlich für die Auswahl eines beliebigen Attributs, und Sie können Ihre Auswahl weiter verfeinern, indem Sie das betreffende Tag angeben (z. B. div in Ihrem Fall).

jQuery("div[id=elemid]")
Mydoghaswürmer
quelle
132
Sie waren der einzige, der die gestellte Frage beantwortete.
wcm
7
Zumindest weiß jemand, wie man in jQuery echte Sachen macht ... Meine Güte! Ich wollte das unbedingt wissen, sonst funktioniert nichts. Ich kann einfach nicht den Ansatz aller anderen verfolgen, Klasse zu benutzen, ich habe es bereits dort, um einen anderen Job zu machen. Gegrüßet seist du @mydoghasworms !!
Fr0zenFyr
3
Dies ist die richtige Antwort und sollte akzeptiert werden, +1
Zach
4
Schön und einfach. Vielen Dank.
James Manes
3
Ich wollte gerade sagen: viele Ratschläge hier, aber keine Antworten. Stattdessen haben Sie zum Glück richtig geantwortet, und ich denke, dies sollte akzeptiert werden, auch wenn der von @ Ballsacian1 vorgeschlagene Ansatz gut ist, um das Problem zu vermeiden.
GigaDIE
35

Ihr Dokument sollte nicht zwei Divs mit derselben ID enthalten. Dies ist ungültiges HTML , weshalb die zugrunde liegende DOM-API dies nicht unterstützt.

Aus dem HTML-Standard :

id = name [CS] Dieses Attribut weist einem Element einen Namen zu. Dieser Name muss in einem Dokument eindeutig sein.

Sie können jedem Div entweder unterschiedliche IDs zuweisen und beide mit auswählen $('#id1, #id2). Oder weisen Sie beiden Elementen ( .clszum Beispiel) dieselbe Klasse zu und $('.cls')wählen Sie beide aus.

Ayman Hourieh
quelle
1
Es sollte auch beachtet werden, dass die meisten der zugrunde liegenden Funktionen von getElementById (), die jQuery und andere Bibliotheken aufrufen, um die eigentliche Suche durchzuführen, sich weigern, etwas anderes als das erste (oder zufällige?) Element zurückzugeben, das mit einer bestimmten ID übereinstimmt, und dies manuell zu unterstützen zu Fuß durch das DOM. Nur nicht wert für ungültiges Markup!
Ironfroggy
1
Zu diesem Beitrag: Interessanterweise gibt es eine Javascript-Funktion getElementsByName (xxx) - beachten Sie den Plural - was bedeutet, dass es vollkommen legal ist, mehr als ein Element mit demselben Namen zu haben ...
Jimbo
1
@ Jimbo - Stimmt, aber meine Antwort bezieht sich auf Elemente mit dem gleichen id, nicht name.
Ayman Hourieh
2
@ Jimbo - ja, Radiogruppen hängen von der Funktion ab. Nicht alle Elemente können Namen haben. In der Frage werden Divs erwähnt, und sie haben kein Namensattribut.
Quentin
4

Versuchen Sie dies, um div anhand der ersten ID auszuwählen

$('div[id^="c-"]')
Atabak
quelle
4

$("div[id^=" + controlid + "]") gibt alle Steuerelemente mit demselben Namen zurück, Sie müssen jedoch sicherstellen, dass der Text in keinem der Steuerelemente vorhanden ist

Niranjan Kumar
quelle
2

Können Sie jedem einzelnen Timer eine eindeutige CSS-Klasse zuweisen? Auf diese Weise können Sie den Selektor für die CSS-Klasse verwenden, der mit mehreren divElementen problemlos funktioniert .

Paul Morie
quelle
paul, nein, ich kann nicht für jeden Timer eine eindeutige Klasse verwenden, da ich die Klasse verwende, um alle Timer auszuwählen, den Countdown-Timer zu initialisieren und zu formatieren.
Markieren Sie
1
HTML- Klasse. Menschen verwenden Klassen fast ausschließlich zum Abgleichen von CSS-Selektoren, wodurch sie nicht Teil einer anderen Sprache sind.
Quentin
0

Sie können auch versuchen, die beiden Divs in zwei Divs mit eindeutigen IDs zu verpacken. Wählen Sie dann die Div durch $("#div1","#wraper1")und$("#div1","#wraper2")

Bitte schön:

<div id="wraper1">
<div id="div1">
</div>
<div id="wraper2">
<div id="div1">
</div>
omer
quelle