Как обойти DOM дерево с поиском нужно класса на JS?
Привет всем!
Есть такая задача. Есть вложенный список данных (уровней может быть сколь угодно). При клике на одном из элементов списка (ссылка) ей устанавливаться класс, например, isActive, Когда пользователь кликнет на другом элемента списка, нужно чтобы на текущий элемент установился класс, а вот по всем остальным ссылкам вложенного списка этот класс удалился.
Так как у нас есть вложенные вертикальные списки, а также и горизонтальные элементы спсика (в некоторых элементах вложенности может и не быть), то нужно скорее всего как то рекурсивно пробегаться по дереву узлов и искать нужные элементы.
Буду признателен за любую помощь.
Если я вдруг выберу самый глубокий элемент списка и установлю ссылке класс, то затем мне нужно каким то образом подняться вверх по дереву найти все ссылки с этим классом и удалить их, но при этом не затрагивая текущую ссылку. Если бы это было горизонтально то проблем никаких. А если это вертикальная вложенность то здесь нужно как то по другому обрабатывать все узлы...
alex0176, ну придумай класс определённый, например is-active-test-123 и убирай и добавляй его у активных элементов, а если где-то там в жопе будет ссылка с классом isActive то это по барабану будет
Алгоритм:
0. В любом случае есть родительский контейнер, поэтому работаешь от него. Лучше чтобы у него был id, тогда при работе функции отслеживания ты сможешь её запускать с нужным айди, она будет универсально и поддерживать множество независимых подобных контейнеров с этим меню.
1. По клику ищешь текущий isActive (с учетом специфичности родительского контейнера) и снимаешь все активные.
2. Делаешь кликнутый активным.