@vanyproduction

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

Есть элементы:
<div class="hello 1"></div>
<div class="hello a"></div>

Надо в атрибут поместить второй класс каждого элемента, у которого есть класс hello. Не могу понять как правильно написать цикл перебора.
  • Вопрос задан
  • 203 просмотра
Решения вопроса 2
0xD34F
@0xD34F Куратор тега JavaScript
Не могу понять как правильно написать цикл перебора.

Цикл не нужен, метод 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();
});
Ответ написан
space2pacman
@space2pacman
Просто царь.
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];
});
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы