jQuery удалить класс CSS из всех потомков одновременно

Question

Могу ли я удалить определенный класс CSS из всех элементов XYZ внутри элемента одновременно?

Пример: удалить класс CSS active из всех <a> якорей в моем поиске div.

Если так, то как?

Answer 1

$("#mydiv a").removeClass("active");

Answer 2

Если поиск - это класс:

$("div.search a").removeClass("active");

Если поиск - это ID:

$("#search a").removeClass("active");

Answer 3

Да. Вы делаете это так:

$("div a .className").removeClass("className")

Или, если вы хотите сделать это только на определенном div, если div имеет установленный атрибут id, вы можете сделать это:

$("#divIDValue a .className").removeClass("className")

С помощью селекторов jQuery # с некоторым текстом после него ссылается на объект (div, span, anchor и т. Д.) С атрибутом id, установленным на любой текст. Точка относится ко всем объектам, имя класса которых совпадает с текстом, следующим за точкой. Как показано выше, вы можете вкладывать текст селектора. Итак, в приведенных выше примерах вот что происходит:

Пример # 1

1. Найти все дивы
2. Находит все якоря внутри всех div
3. Находит все якоря из # 2, имеющие класс .className

Пример # 2

1. Найдите div с атрибутом id, установленным в "divIDValue"
2. Найти все теги привязки в этом div
3. Найти все теги привязки в этом списке тегов привязки, которые соответствуют имени класса className

Имейте в виду, что для всех объектов на вашей странице только один объект может иметь любое конкретное значение id. Таким образом, у вас может быть два объекта с id, установленным в 'divIDValue' - хотя ваша страница, вероятно, будет выглядеть нормально, jQuery найдет только первый элемент с id. Классы, с другой стороны, могут использоваться для нескольких предметов (как вы, вероятно, уже знаете).

Answer 4

Более общее решение для удаления класса из любого возможного элемента.

// I like to use find as I usually have my wrapper in a variable.
$('#my-wrapper').find('.active').removeClass('active');

Или

$('#my-wrapper .active').removeClass('active');

Это повлияет на все элементы в оболочке: span, h3, div, li, td и т. Д. В html 5 теперь доступно более 100 возможных тегов.