Umgang mit mehreren IDs in jQuery

Können mehrere IDs wie im Code behandelt werden?

<script>
$("#segement1, #segement2, #segement3").hide()
</script>

<div id="segement1"/>
<div id="segement2"/>
<div id="segement3"/>

jquery jquery-selectors

— Rajeev
quelle

Antworten:

131

Ja, #idSelektoren in Kombination mit einem Mehrfachselektor (Komma) sind sowohl in jQuery als auch in CSS perfekt gültig.

Doch für Ihr Beispiel, da <script>kommt , bevor die Elemente, Sie müssen document.readyHandler, so wartet sie , bis die Elemente im DOM sind für sie zu gehen auf der Suche, wie folgt aus :

<script>
  $(function() {
    $("#segement1,#segement2,#segement3").hide()
  });
</script>

<div id="segement1"></div>
<div id="segement2"></div>
<div id="segement3"></div>

— Nick Craver
quelle

Wenn es keinen Inhalt für div gibt, können wir einfach <div id = "segment1" /> schreiben, oder?

— Rajeev

@ Rajeev - nein, es ist kein selbstschließendes Element :)

— Nick Craver

Was ist, wenn diese Divs automatisch #segment {i} generiert werden und es eine undefinierte Menge davon gibt?

— Reveclair

@Reveclaire Wenn Sie müssten, verwenden Sie einen Attributselektor "beginnt mit" wie $("[id^=segement]").hide()folgt : (Es wäre keine schlechte Idee, ihn ein wenig auf das zu beschränken, was der Elternteil ist).

— Nick Craver

Lösung:

Auf Ihre sekundäre Frage

var elem1 = $('#elem1'),
    elem2 = $('#elem2'),
    elem3 = $('#elem3');

Sie können die Variable als Ersatz für den Selektor verwenden.

elem1.css ({'display': 'none'}); //wird funktionieren

Im folgenden Fall ist der Selektor bereits in einer Variablen gespeichert.

$ (elem1, elem2, elem3) .css ({'display': 'none'}); // wird nicht funktionieren

— Zeeshan Eqbal
quelle