JavaScript метод Node.isEqualNode()

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

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

Два узла идентичны, если выполняются все следующие условия:

• Они имеют одинаковый тип узла (nodeType).
• Они имеют одинаковое имя узла (nodeName), значение узла (nodeValue), localName, namespaceURI и prefix.
• У них одинаковые дочерние узлы со всеми потомками.
• Они имеют одинаковые атрибуты и значения атрибутов (атрибуты не обязательно должны быть в том же порядке).

Если вам необходимо проверить являются ли два узла одинаковыми (ссылаются на один и тот же объект), то вы можете воспользоваться методом isSameNode().

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

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

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

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

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

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

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

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

JavaScript синтаксис

const booleanResult = node.isEqualNode(otherNode);

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

DOM Standard.

Значения параметров

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

Сравнение узлов: isEqualNode() и isSameNode()

Нажмите ▶, затем обе кнопки. isEqualNode() вернёт true для одинаковых пунктов списка (у третьего есть класс active, поэтому false), а isSameNode() — только для самого первого пункта.

index.html

HTML

<button data-migration-click-0="">isEqualNode</button>
<button data-migration-click-2="">isSameNode</button>
<ul>
  <li>Элемент списка</li>
  <li>Элемент списка</li>
  <li class="active">Элемент списка</li>
  <li>Элемент списка</li>
  <li style="color: red">Элемент списка</li>
</ul>
<div style="display: flex">
  <div id="result">isEqual:<br /></div>
  <div id="result2" style="margin-left: 20px">isSameNode:<br /></div>
</div>

main.js

JavaScript

const listElements = document.querySelectorAll('li')

function myFunc() {
    let result = document.getElementById('result')

    for (let i = 0; i < listElements.length; i++) {
        result.innerHTML += listElements[i].isEqualNode(listElements[0]) + '<br/>'
    }
}

function myFunc2() {
    let result = document.getElementById('result2')

    for (let i = 0; i < listElements.length; i++) {
        result.innerHTML += listElements[i].isSameNode(listElements[0]) + '<br/>'
    }
}

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

В этом примере с использованием метода addEventListener() при нажатии на определенную кнопку (HTML элемент <button>) вызываем функцию myFunc(), или myFunc2().

Первая функция позволяет пройти циклом по всем элементам <li> и добавить в содержимое элемента с определенным id результат сравнения на идентичность с использованием метода isEqualNode() текущего узла с первым элементом <li> в документе.

Вторая функция позволяет пройти циклом по всем элементам <li> и добавить в содержимое элемента с определенным id результат сравнения на одинаковость с использованием метода isSameNode() текущего узла с первым элементом <li> в документе.

Отличие методов isEqualNode() и isSameNode() в этом примере очевидно: isSameNode() возвращает логическое значение true только в первом случае, когда элемент ссылается на тот же объект (первый элемент списка сравнивается сам с собой), а метод isEqualNode() возвращает логическое значение true, когда два узла идентичны (имеют один и тот же тип, имя тега, атрибуты и дочерние узлы).