JavaScript метод Node.hasChildNodes()

Определение и применение

JavaScript метод .hasChildNodes() объекта Node возвращает логическое значение, которое указывает на то есть ли у элемента дочерние узлы, или нет.

Поддержка браузерами

Спецификация: dom.spec.whatwg

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьapi.Node.hasChildNodes

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
hasChildNodes	✓1	✓12	✓1	✓≤12.1	✓1	✓18	✓4	✓≤12.1	✓1	✓1.0	✓4.4	✓1

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

JavaScript синтаксис

const booleanResult = node.hasChildNodes();

Спецификация

DOM Standard.

Пример использования

Удаление дочерних узлов, пока они есть

Нажмите ▶, затем Test несколько раз: каждый щелчок удаляет первый дочерний узел списка (включая текстовые узлы-пробелы). Когда узлов не останется, будет удалён сам список.

index.html

HTML

<button data-migration-click-0="">Test</button>
<ul id="first">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>

main.js

JavaScript

function myFunc() {
    const firstUl = document.getElementById('first')

    if (!firstUl) {
        return
    }

    if (firstUl.hasChildNodes()) {
        firstUl.removeChild(firstUl.firstChild)
    } else {
        document.body.removeChild(firstUl)
    }
}

// Обработчики кнопок перенесены из HTML для запуска с CSP без inline-скриптов.
document.querySelector('[data-migration-click-0]').addEventListener('click', function () {
    myFunc()
})
document.querySelector('[data-migration-click-0]').removeAttribute('data-migration-click-0')

В этом примере с использованием метода addEventListener() при нажатии на кнопку (HTML элемент <button>) вызываем функцию myFunc(), которая с использованием JavaScript метода .hasChildNodes() объекта Node проверяет, имеются ли у элемента <ul> дочерние узлы. Если элемент имеет дочерние узлы, то с помощью метода .removeChild() удаляем его первый дочерний узел, если элемент не имеет дочерних узлов, то удаляется сам элемент <ul>. Если элемент <ul> отсутствует в дереве DOM, то функция прекращает выполнение.