Добавить один и тот же класс к нескольким объектам

Question

Мне нужно добавить одно имя класса для нескольких объектов с помощью jQuery.

Мне известно о добавлении класса к нескольким селекторам, например:

$("#Div4 ,#Div5 ,#Div7 ,#Div8").addClass("something");

Я пробовал следующеекод, но он применяет класс только к первому объекту.

$(a[i].source, a[i].canvas, a[i].target).addClass("something");

В приведенном выше случае имя класса something применяется только к a[i].source

Мысли?

Answer 1

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

<div class="selectorClass"></div>
<span class="selectorClass"></span>

, а затем используйте jquery

$(".selectorClass").addClass("something")

Answer 2

Предполагая, что a[i].source и т. Д. Действительно ссылаются на узел / элемент, вы можете использовать .add(), чтобы добавить их по отдельности в коллекцию , то есть:

$(a[i].source).add(a[i].canvas).add(a[i].target).addClass('something');

Этоможет быть излишне многословным.Вы можете просто сконструировать массив и рассчитывать на неявную итерацию в jQuery ( кредит @ Rory ):

$([a[i].source, a[i].canvas, a[i].target]).addClass('something');

Однако это на самом деле не нужно.Как насчет просто использовать нативный JS?Array.prototype.forEach() и Element.classList очень широко поддерживаются на сегодняшний день:

ES6:

[a[i].source, a[i].canvas, a[i].target].forEach(el => el.classList.add('something'));

ES5 (если вам нужна обратная совместимость с старыми браузерами, которые не поддерживают синтаксис ES6):

[a[i].source, a[i].canvas, a[i].target].forEach(function(el) {
    el.classList.add('something');
});