Как проверить наличие DOM элемента в Javascript

27.08.2019

Часто нам нужно проделать какую-либо операцию с конкретным элементом, при этом если нужный нам элемент не будет найдем в DOM мы увидим ошибку в консоли. Поэтому необходимо проверять наличие элемента перед работой с ним.

Разберем несколько способов того, как можно проверить наличие элемента в DOM. Для начала создадим элемент:

<div id="element" class="element"></div>

Используем метод querySelector:

if ( document.querySelector(".element") ) {
    alert("Элемент найден!");
}

Или метод querySelectorAll. Поскольку этот метод возвращает объект нужно использовать свойство length:

if ( document.querySelectorAll(".element").length ) {
    alert("Элемент найден!");
}

Можно найти элемент по его id:

if ( document.getElementById("element") ) {
    alert("Элемент найден!");
}

Существует еще несколько способов, например, с использованием getElementsByName() и getElementsByClassName(), они работают по тому же простому принципу, что и предыдущие примеры.

« список статей