Wie prüfe ich, ob Element Kinder in Javascript hat?

Ein paar Möglichkeiten:

if (element.firstChild) {
    // It has at least one
}

oder die Funktion hasChildNodes():

if (element.hasChildNodes()) {
    // It has at least one
}

oder die length-Eigenschaft von childNodes:

if (element.childNodes.length > 0) { // Or just `if (element.childNodes.length)`
    // It has at least one
}

Wenn Sie nur unter elements (im Gegensatz zu Textknoten, Attributknoten usw.) in allen modernen Browsern (und IE8 - tatsächlich sogar IE6) wissen möchten, können Sie Folgendes tun: (Vielen Dank Florian !)

if (element.children.length > 0) { // Or just `if (element.children.length)`
    // It has at least one element as a child
}

Dies hängt von der Eigenschaft children ab, die nicht in DOM1 , DOM2 , oderDOM3 definiert wurde, die aber nahezu universelle Unterstützung bietet. (Dies funktioniert bereits ab November 2012, als dies ursprünglich geschrieben wurde, ab IE6 und Chrome, Firefox und Opera bei least.) Wenn Sie ältere mobile Geräte unterstützen, sollten Sie unbedingt nach Unterstützung suchen.

Wenn Sie keine Unterstützung für IE8 und frühere Versionen benötigen, können Sie auch Folgendes tun:

if (element.firstElementChild) {
    // It has at least one element as a child
}

Das hängt von firstElementChild ab. Wie children wurde es auch nicht in DOM1-3 definiert, aber im Gegensatz zu children wurde es - bis IE9 nicht zu IE hinzugefügt.

Wenn Sie sich an etwas halten wollen, das in DOM1 definiert ist (möglicherweise müssen Sie wirklich unübersichtliche Browser unterstützen), müssen Sie mehr Arbeit erledigen:

var hasChildElements, child;
hasChildElements = false;
for (child = element.firstChild; child; child = child.nextSibling) {
    if (child.nodeType == 1) { // 1 == Element
        hasChildElements = true;
        break;
    }
}

All dies ist Teil von DOM1 und wird nahezu universell unterstützt.

Es wäre leicht, dies in einer Funktion zusammenzufassen, z.

function hasChildElement(Elm) {
    var child, rv;

    if (Elm.children) {
        // Supports `children`
        rv = Elm.children.length !== 0;
    } else {
        // The hard way...
        rv = false;
        for (child = element.firstChild; !rv && child; child = child.nextSibling) {
            if (child.nodeType == 1) { // 1 == Element
                rv = true;
            }
        }
    }
    return rv;
}