Auswählen von verschachtelten Elementen

Ich habe eine Seite Hierarchie wie folgt aus:Auswählen von verschachtelten Elementen

<div class="panel" attribute-id="1"> 
    <button class="delete"> 
    <div class="panel" attribute-id="2" association-id="20"> 
    <button class="delete"> 
    </div> 
</div> 
....

Also habe ich ein paar dieser Platten mit verschachtelten Platten nach innen, und ich versuche, auf Click-Handler zu erstellen, die auf für die Lösch Tasten nur die Top-Level-Panels (also diejenigen, die sich unmittelbar in Panels befinden, die keine Assoziations-ID haben). Der einzige Unterschied zwischen dem Eltern- und dem Kinderpanel besteht darin, dass die untergeordneten Elemente das zusätzliche Attribut "association-id" haben.

So kann ich die Top-Level-Panels wählen nur etwa so:

$('.panel[attribute-id]:not([association-id]')

Aber wenn ich versuche, von der Löschtasten erhalten von diesen wie:

$('.panel[attribute-id]:not([association-id] .delete')

Offensichtlich ich noch werde um die untergeordneten Schaltflächen zu erhalten.

Ich kann den HTML-Code sowieso nicht ändern, wie könnte ich das tun?

Quelle

2016-04-21 SpeedOfRound

$(':not(.panel[attribute-id][association-id]) > .delete')

scheint den Trick zu tun.

jsfiddle

habe ich .panel-group-.panel geändert, um es mit dem HTML zur Verfügung gestellt, um die Arbeit.

Quelle

2016-04-21 20:36:45 spaceman

Wickeln Sie sie alle in ein Div und weisen Sie diesem Div eine eindeutige Klasse zu. Dann können Sie jquery selector ".panel-group> .panel" verwenden, um nur direkte untergeordnete Elemente zu erhalten.

<div class="panel-group"> 

<div class="panel" attribute-id="1"> 
    <button class="delete"> 
    <div class="panel" attribute-id="2" association-id="20"> 
    <button class="delete"> 
    </div> 
</div> 

<div class="panel" attribute-id="11"> 
    <button class="delete"> 
    <div class="panel" attribute-id="12" association-id="120"> 
    <button class="delete"> 
    </div> 
</div> 

</div>

Quelle

2016-04-21 20:28:31

Pro OP - "Ich kann das HTML in sowieso nicht ändern" – IrkenInvader

Guter Fang. OP, wie sieht der Rest des HTML aus? Kann in der Lage sein, etwas anderes zu nutzen, das bereits da ist. Wo ist die panel_group div? Im Grunde brauchen Sie das nächste Level-Up-Element. Wenn das eine Panel-Gruppe ist, dann kannst du einfach ".panel-group> .panel" machen. Der Operator ">" ruft die nächste Ebene im Vergleich zu allen untergeordneten Elementen ab. –

Sie können die Kinder-Methode verwenden:

$('.panel-group[attribute-id]').children('button').first()

Quelle

2016-04-21 20:28:57

Auswählen von verschachtelten Elementen

Antwort

Verwandte Themen