Как добавить класс элементу, найденному по классу?

Question

[Михаил Р.]

Если элемент найден по id, то класс ему добавляется без проблем:

document.getElementById('body').classList.add("test1");

Пытаюсь сделать то же самое, но теперь поиск элемента произвожу по его классу, в итоге ошибка:

document.getElementsByClassName('body').classList.add("test2");

Так как добавлять класс элементу, если этот элемент найден не по названию id, а по названию класса?

Answer 1

[Михаил]

Вы находите "элементы", а не один элемент.
Правильно например так:

document.querySelector('.body').classList.add("test2");

Если у вас много таких классов и всем надо добавить ещё, то придется воспользоваться циклом for:

var elements = document.getElementsByClassName("body");
for (var i = 0; i < elements.length; i++) {
    elements[i].classList.add("test2");
}

Comments

[Михаил Р.]

И body это тег, а не класс

С чего это Вы взяли? Разве название класса не может быть "body"?

[Михаил]

Mike Ro, Погорячился просто)) Уже поправил ответ.

[Михаил Р.]

Михаил, понял проблему, проблема была не в селекторе. По логике с getById я думал, что мне и с getByClass вернется 1 элемент, но js отдает все найденные элементы с этим классом, следовательно логично, что к массиву с элементами просто так не прикрутишь новый класс. Если я правильно понял, то нужно вначале прогнать массив циклом и уже в теле цикла прикручивать класс к каждому элементу?

[Михаил]

Mike Ro, Смотрите, если вы уверены, что элемент с таким классом один, то вместо getElementsByClassName воспользуйтесь querySelector. Если элементов может быть несколько и нужно всем добавить класс, то через цикл.

[Михаил Р.]

Михаил, понял, спасибо!

Answer 2

[Александр Аксентьев]

getElementsByClassName

getElementById

https://www.w3schools.com/jsref/met_document_getel...
третий пример