В этой статье блога мы рассмотрим различные методы 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 позволяет перебирать набор элементов. В этом методе мы перебираем все элементы определенного класса и применяем условную проверку, чтобы исключить элемент, который мы хотим оставить видимым.