Zeitreise
Ich möchte den ersten Elternteil erhalten, der ein bestimmtes Klassenpräfix hat, angenommen:
<div class="div-a3332">
<div class="div-a89892">
<p>
<div class="div-b2">
<div id="divid">hi</div>
</div>
</p>
</div>
</div>
Mein aktuelles Element ist beispielsweise #divid und ich möchte das erste Element finden, das das Klassenpräfix div-a hat. Im Grunde wird also Folgendes ausgewählt:
<div class="div-a89892">
Mattball
Verwenden .closest() mit Selektor:
var $div = $('#divid').closest('div[class^="div-a"]');
Übrigens, keine Ahnung, warum dies abgelehnt wurde. Der Klassenpräfixselektor ist spröde, aber er Wille Arbeit.
– Mattball
17. September 2011 um 20:49 Uhr
Zu OP: Stellen Sie sicher, dass das Element, nach dem Sie suchen, ein übergeordnetes Element irgendwo im DOM-Baum ist und kein Geschwister oder ähnliches zu dem Objekt, nach dem Sie suchen (gemäß der Dokumentation). Es ist nicht “am nächsten im Dokument”, sondern “am nächsten durch Aufarbeiten des DOM-Baums”.
– Christian P.
17. September 2011 um 20:57 Uhr
Funktioniert nicht für mich. Außerdem möchte ich das erste Element finden, das ein bestimmtes Präfix hat, das muss kein div-Element sein.
– Zeitreise
17. September 2011 um 21:07 Uhr
@Time entferne dann die div Elementselektor: $('#divid').closest('[class^="div-a"]'). Wie @Stefan jedoch kommentierte, sollten Sie wirklich mehrere Klassen verwenden.
– Mattball
17. September 2011 um 21:18 Uhr
Dieser Selektor benötigt eine absurde Anzahl von Zyklen (aber er kann trotzdem schnell sein). Wenn Sie IE6, IE7 oder IE8 unterstützen müssen, kann dies Sie wirklich durcheinander bringen, wenn Ihr DOM zu groß wird; IE zeigt den Dialog „Skript antwortet nicht“ an, wenn eine bestimmte Anzahl von JS-VM-Anweisungen ausgeführt werden, und NICHT nach einer bestimmten Zeit. Ich habe Skripte gesehen, die den Internet Explorer aus genau diesem Grund in 0,1 ms zum Absturz bringen.
– Stefan Kendall
17. September 2011 um 23:35 Uhr
Sunny R. Gupta
Jquery erlaubte Ihnen später, die Eltern mit der zu finden .parents() Methode.
Daher empfehle ich die Verwendung von:
var $div = $('#divid').parents('div[class^="div-a"]');
Dadurch werden alle übergeordneten Knoten angezeigt, die mit dem Selektor übereinstimmen. Um den ersten Elternteil zu erhalten, der mit dem Selektor übereinstimmt, verwenden Sie:
var $div = $('#divid').parents('div[class^="div-a"]').eq(0);
Weitere solche DOM-Traversal-Abfragen finden Sie in der Dokumentation unter Durchqueren des DOM.
Die Antwort ist nicht irreführend, sie zeigt nur eine andere Alternative zu .closest(), .parents() sieht besser lesbar aus und ist eine weitere Lösung für das Problem.
– Sunny R Gupta
8. Juli 2013 um 9:05 Uhr
Am nächsten ist eine bessere Lösung als diese, da am nächsten nur die erste Übereinstimmung gefunden wird, während die Eltern ALLE Übereinstimmungen finden, die im DOM nach oben gehen. Offensichtlich effizienter zu verwenden am nächsten, obwohl ich zustimme, ist es nicht die am besten benannte Funktion.
– Mog0
28. November 2014 um 13:34 Uhr
Komischerweise habe ich diese Lösung schließlich verwendet, da .parentsUtil() nicht wie erwartet funktionierte.
– Handy markieren
5. April 2016 um 13:49 Uhr
Halt. Verwenden Sie mehrere Klassen, anstatt Informationen in einer Klasse zusammenzufassen. Der „Matching“-Selektor ist langsam, und dieses Design lässt sich nicht für Modifikationen skalieren.
<div class='a'>dann stellen Sie Regeln für bereitdiv.a. Ich weiß nicht, warum Sie setzendivüberhaupt im Klassennamen.– Stefan Kendall
17. September 2011 um 20:43 Uhr
Führen Sie dennoch keine Daten in Klassenpräfixen zusammen. Dies ist ein schreckliches Muster, das mit mehreren Klassen leicht behoben werden kann.
– Stefan Kendall
17. September 2011 um 23:33 Uhr
@StefanKendall: Manchmal haben Sie es mit dem Mist anderer Drittanbieter zu tun, und manchmal unterstützen Sie veraltete Apps, die Sie nicht schnell reparieren können. Schlechtes Design ist eine Tatsache des Lebens, und diese Frage ist absolut berechtigt.
– Nerdmeister
4. April 2013 um 20:45 Uhr