@vanyproduction

Как написать такую конструкцию на JS?

Здравствуйте, я плохо разбираюсь в JS, но вот что хочу сделать.
Есть
<div id="container" class="not-active">
</div>
<div id="container" class="active">
    <div id="child" class="s-active"><div id="img"></div></div>
    <div id="child" class="s-not-active"><div id="img"></div></div>
    <div id="child" class="s-not-active"><div id="img"></div></div>
</div>

Есть 3 дива внутри родительского дива.
Когда родитель получает класс .active, дочерние 3 div'a по очереди получают класс .s-active.

1) Как на js написать такое?

if (#container имеет класс .active || #child имеет класс .active) {
мой код, который будет работать с #img
};

2) важно то, что один из #container постоянно активный и #container, который был активным, опять может стать активным + я так понимаю, что нужно иметь ввиду, что #img несколько, т.е. надо каждый раз заново сканировать #img внутри его родителя.

т.е. обычными if не обойтись. В общем знания у меня поверхностные, прошу помощи.
  • Вопрос задан
  • 225 просмотров
Пригласить эксперта
Ответы на вопрос 1
@heartdevil
плыву как воздушный шарик
Привет.

У вас в html-структуре повторяются id у элементов. Такого нельзя делать если вы работаете с этой структурой в js.
Каждый элемент должен быть уникальным. Уникальность задается по id. Это не касается классов.

для того, чтобы найти в dom ваш контейнер используйте это

var container = document.getElementById("container");


для того, чтобы найти все дочерние элементы у родительского элемента используйте это

var children = container.getElementsByTagName("div");


чтобы задать класс у элемента используйте свойство className;

container.className = "active";

для задания класса группе элементов нужен цикл.

for (var i = 0; i < children.length; i++)
{
children[i].className = "s-active";
}
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы