Как проверить, существует ли элемент на странице с помощью jQuery?

Правильный способ проверки существования элемента в jQuery

Вы абсолютно правы — $('.my-block') всегда возвращает jQuery-объект, даже если элементов с таким селектором не найдено. Это особенность jQuery: она возвращает пустую коллекцию, которая всё равно считается truthy-значением в JavaScript.

Правильный подход — проверять длину коллекции (свойство .length). Вот как это делается:

// Самый распространённый способ
if ($('.my-block').length) {
    $('.my-block').hide();
}

// Или более кратко (но менее читаемо)
if ($('.my-block').length > 0) {
    $('.my-block').hide();
}

Если .length равен 0, условие считается false, и код внутри блока не выполнится. Если найден хотя бы один элемент — выполнится.

Почему это работает?

jQuery-объект ведёт себя как массивоподобная структура. Свойство .length возвращает количество найденных DOM-элементов. Пустая коллекция имеет .length === 0, что в логическом контексте даёт false.

Более элегантный подход с цепочкой методов

Если вам нужно выполнить несколько действий с элементом, лучше сохранить его в переменную:

const $myBlock = $('.my-block');

if ($myBlock.length) {
    $myBlock.hide().addClass('hidden').text('Скрыто');
}

Метод .exists() — миф или реальность?

В jQuery нет встроенного метода .exists(). Некоторые разработчики добавляют его сами:

// Расширение jQuery (не обязательно)
jQuery.fn.exists = function() {
    return this.length > 0;
};

// Использование
if ($('.my-block').exists()) {
    // ...
}

Но я рекомендую использовать стандартный .length — это понятно всем jQuery-разработчикам и не требует дополнительного кода.

Проверка для одного конкретного элемента

Если вы ищете один элемент (например, по ID), подход тот же:

if ($('#my-id').length) {
    $('#my-id').show();
}

Важный нюанс: контекст поиска

Иногда элементы могут существовать, но быть скрытыми или находиться внутри iframe. Проверка .length учитывает только физическое присутствие в DOM, а не видимость. Для проверки видимости используйте:

if ($('.my-block').is(':visible')) {
    // Элемент видим
}

Заключение

Запомните простое правило: всегда проверяйте .length перед работой с результатами jQuery-селектора. Это убережёт вас от ошибок и сделает код надёжнее. Ваш первоначальный вариант if ($('.my-block')) не работает именно потому, что jQuery-объект — это всегда объект, а не null или undefined.

const element = $('.my-block').get(0); // или $('.my-block')[0]

if (element) {
    // element — это нативный DOM-элемент
    element.style.display = 'none';
    // Или снова обернуть в jQuery:
    $(element).hide();
}