Эффективные способы скрыть все элементы определенного класса в jQuery, кроме одного

В этой статье блога мы рассмотрим различные методы jQuery, позволяющие скрыть все элементы определенного класса, за исключением одного элемента. Мы предоставим примеры кода, чтобы продемонстрировать каждый метод и помочь вам понять, как реализовать их в ваших проектах. К концу этой статьи в вашем распоряжении будет несколько методов эффективного достижения этой функциональности.

Метод 1: использование селектора :not()
Пример кода:

$('.your-class:not(#element-to-exclude)').hide();

Объяснение:
Селектор :not()в jQuery позволяет исключать определенные элементы из выбора. В этом методе мы используем селектор класса, чтобы выбрать все элементы определенного класса и объединить его с селектором :not(), чтобы исключить элемент, который мы хотим оставить видимым.

Метод 2: использование метода not()
Пример кода:

$('.your-class').not('#element-to-exclude').hide();

Объяснение:
Метод not()в jQuery аналогичен селектору :not(). Он отфильтровывает элементы из выбранного набора на основе заданных критериев. Здесь мы выбираем все элементы определенного класса и используем метод not(), чтобы исключить элемент, который мы хотим оставить видимым.

Метод 3: использование метода filter()
Пример кода:

$('.your-class').filter(':not(#element-to-exclude)').hide();

Объяснение:
Метод filter()в jQuery позволяет сузить набор выбранных элементов на основе определенного условия. В этом методе мы выбираем все элементы определенного класса и используем метод filter(), чтобы исключить элемент, который мы хотим оставить видимым.

Метод 4: использование методаeach()
Пример кода:

$('.your-class').each(function() {
  if (!$(this).is('#element-to-exclude')) {
    $(this).hide();
  }
});

Объяснение:
Метод each()в jQuery позволяет перебирать набор элементов. В этом методе мы перебираем все элементы определенного класса и применяем условную проверку, чтобы исключить элемент, который мы хотим оставить видимым.