Как скопировать class в атрибут для каждого элемента, у которого есть class?

Question

[VANY]

Есть элементы:

<div class="hello 1"></div>
<div class="hello a"></div>

Надо в атрибут поместить второй класс каждого элемента, у которого есть класс hello. Не могу понять как правильно написать цикл перебора.

Answer 1

[0xD34F]

Не могу понять как правильно написать цикл перебора.

Цикл не нужен, метод attr умеет принимать функцию и применять её к каждому элементу набора:

$('.hello').attr('data-class', function() {
  return [...this.classList].filter(n => n !== 'hello');
});

И без jquery - цикл в явном виде тоже не нужен:

document.querySelectorAll('.hello').forEach(n => {
  n.dataset.class = n.className.replace(/(^| )hello( | $)/, ' ').trim();
});

Одно непонятно - гарантируется ли, что классов будет всего два? Что если их окажется больше?

Но если точно известно, что классов будет всегда два, и порядок тоже гарантирован, то можно буквально хватать "второй" класс:

$('.hello').attr('data-class', function() {
  return this.classList[1];
});

или

document.querySelectorAll('.hello').forEach(n => {
  n.dataset.class = n.className.split(' ').pop();
});

Comments

[Ярослав Иванов]

Мне кажется таким людям ES5/ES6 сложен будет для понимания)

[Ярослав Иванов]

Что если их окажется больше?

Обращаться просто ко второму)))

[VANY]

0xD34F, классов может быть сколько угодно.
Ярослав Иванов, я не против использовать новое, но т.к. js для меня непрофильный, то и не изучал новые версии.

[0xD34F]

Иван Украинцев,

классов может быть сколько угодно

Копировать все, кроме "hello"? Если да - как они должны быть объединены? Если нет - как понять, какой именно должен быть скопирован?

[0xD34F]

Ярослав Иванов,

Обращаться просто ко второму

Неприемлемо. Кто гарантирует, что нужный класс будет именно вторым?

[Ярослав Иванов]

0xD34F, Да я шуча) тут сама задача так себе брать только второй класс) много нюансов.

[Ярослав Иванов]

Хотя автор дает четкое задание)

Надо в атрибут поместить второй класс каждого элемента

[alex]

0xD34F, Ярослав Иванов, а есть гарантии что этот второй класс в массиве не будет hello? т.е. порядок элементов массива classlist соответсвует порядку записи классов в самом атрибуте class в тэге?

[Ярослав Иванов]

Alex, а мы то какое отношение имеем к его структуре проекта?)))

Answer 2

[Ярослав Иванов]

JS
jsfiddle.net/vbcp4Lae

var hello = document.querySelectorAll(".hello");

for(var i = 0; i < hello.length; i++) {
	hello[i].setAttribute("classAttr", hello[i].classList[1]);
}

JQUERY
jsfiddle.net/vbcp4Lae/1

$(".hello").attr("classAttr", function() {
	return this.classList[1];
});