if (div id=myfav has children) {
do something
} else {
do something else
}
Ich habe alles versucht:
if ( $('#myfav:hasChildren') ) { do something }
if ( $('#myfav').children() ) { do something }
if ( $('#myfav:empty') ) { do something }
if ( $('#myfav:not(:has(*))') ) { do something }
S Pangborn
if ( $('#myfav').children().length > 0 ) {
// do something
}
Das sollte funktionieren. Der children() Die Funktion gibt ein JQuery-Objekt zurück, das die untergeordneten Elemente enthält. Sie müssen also nur die Größe überprüfen und sehen, ob es mindestens ein Kind hat.
Danke für die Antwort. Das ist, was für mich funktioniert hat. Ich wusste, dass ich mit .children() auf dem richtigen Weg war, wusste aber nicht, was daran falsch war. Anscheinend könnte die Größe 0 sein, macht Sinn.
– Chris
6. Oktober 09 um 18:57 Uhr
Wenn Sie untergeordneten Elementen einen Selektor hinzufügen, können Sie auch prüfen, ob ein Element untergeordnete Elemente hat, die mit einem bestimmten Selektor übereinstimmen, z. B. wenn Sie sehen möchten, ob ein Element ein untergeordnetes Element einer bestimmten Klasse hat.
– Muhd
5. Mai 11 um 3:43 Uhr
geringes Problem. will nicht pingelig sein, aber children().length sollte hier anstelle von size() per jQuery docs aufgerufen werden: api.jquery.com/size
– Brian Chávez
7. Mai 11 um 5:06 Uhr
Und was ist, wenn der Knoten nur Text enthält!?
– botenvouwer
9. August 13 um 9:43 Uhr
@sirwilliam Der Knoten wird mit einer Länge von 0 zurückgegeben.
– Meki
14. September 15 um 12:50 Uhr
dcharles
Dieses Snippet bestimmt, ob das Element untergeordnete Elemente hat, die das verwenden :parent Wähler:
if ($('#myfav').is(':parent')) {
// do something
}
Beachten Sie, dass :parent betrachtet auch ein Element mit einem oder mehreren Textknoten als übergeordnetes Element.
Und so kam es dass der div Elemente hinein <div>some text</div> und <div><span>some text</span></div> wird jedoch jeweils als Elternteil betrachtet <div></div> ist kein Elternteil.
Ja, ich denke, diese Antwort ist eleganter als die von S Pangborn. Beide sind jedoch völlig legitim.
– Kyle Farris
6. Oktober 09 um 18:58 Uhr
@Milo LaMar, ich würde vermuten, dass es keinen großen Leistungsunterschied gibt, aber der einzige Weg, um sicherzugehen, ist, es zu versuchen! Außerdem müssten Sie den Abstand zwischen entfernen #myfav und :parent in Ihrem Beispiel, sonst ist der Selektor nicht derselbe wie meine Antwort.
– dcharles
12. Januar 12 um 19:11 Uhr
Eine sehr kleine Menge an Lektüre beantwortete mir genug. Genommen von api.jquery.com/parent-selectorAdditional Notes: Because :parent is a jQuery extension and not part of the CSS specification, queries using :parent cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. To achieve the best performance when using :parent to select elements, first select the elements using a pure CSS selector, then use .filter(":parent").
– Milo LaMar
13. Januar 12 um 02:54 Uhr
Leistungstestergebnisse in 0,002s – ich bevorzuge diesen Weg, weil er am besten lesbar ist …
– Trunkenheit
1. März 12 um 10:15 Uhr
Ich bin verwirrt, ist das nicht die beste Antwort?
– Andrej Cristian Prodan
1. Oktober 12 um 13:30 Uhr
Eine andere Option, nur so zum Teufel, wäre:
if ( $('#myFav > *').length > 0 ) {
// do something
}
Kann tatsächlich das schnellste sein, da es ausschließlich die Sizzle-Engine verwendet und nicht unbedingt irgendein jQuery, sozusagen. Könnte aber falsch sein. Trotzdem funktioniert es.
und wenn Sie überprüfen möchten, ob div bestimmte Kinder hat (sagen wir <p> benutzen:
if ($('#myfav').children('p').length > 0) {
// do something
}
$(...)[0] is undefined Dies kann passieren, wenn #myfav wurde nicht gefunden. Ich würde die Existenz des ersten übereinstimmenden Elements testen, bevor ich diese Bedingung anwende, dh: $('#myfav')[0] && $('#myfav')[0].hasChildNodes().
– CPHPython
11. September 18 um 13:19 Uhr
Sie können auch überprüfen, ob div bestimmte Kinder hat oder nicht,
if($('#myDiv').has('select').length>0)
{
// Do something here.
console.log("you can log here");
}
Der jQuery-Weg
In jQuery können Sie verwenden $('#id').children().length > 0 um zu testen, ob ein Element Kinder hat.
<script src="https://code.jquery.com/jquery-1.12.2.min.js"></script>
<div id="test">
<span>Children</span>
</div>
<div id="test2">
No children
</div>
Der Vanilla-JS-Weg
Wenn Sie jQuery nicht verwenden möchten, können Sie verwenden document.getElementById('id').children.length > 0 um zu testen, ob ein Element Kinder hat.