Как можно избежать дублирование кода?

Question

[mukzer]

Пытаюсь сделать "табы в табах", получилось вот такое
как можно улучшить код, что бы небыло повторение JavaScipt кода?
Делаю вот такие табы

Answer 1

[Gennady S]

Масса способов. Самое простое, добавьте активным элементам общий класс и работайте с ним, а не с tabs или subTabs, tabs-triggers__item или subtabs-triggers__item раздельно. Плюс, Вам достаточно внести разницу, если она вообще нужна, только в корневой элемент, а не делать различными все классы по иерархии: subtabs-content__item и tabs-triggers__item — лишнее усложнение, достаточно tabs_trigger__item в обоих случаях. Чтобы задать разные стили, достаточно разделять по родителю, а точнее, задать особенности для дочерних вкладок. Плюс, Вам необязательно делать вкладки вложенными друг в друга, можно расположить их друг под другом. Что касается JS, не вызывайте функцию раньше, чем она объявлена, и лучше обернуть от глобальной области видимости:

function initTabs() {
  // здесь весь нужный код
}
document.addEventListener('DOMContentLoaded', initTabs);

Answer 2

[TheOnlyFastCoder2]

Что то вроде этого : https://codepen.io/theonlyfastcoder2/pen/JjNJXyv ?
Вам всего-лишь нужно изменить дизайн этой менюшки , и изменить или добавить теги li в menu-lowerNav_ul
в принципе на этом все.

Comments

[mukzer]

Дело в том, что это не меню, а табы. В одном из табов есть ещё табы в которых уже контент... Как-то так)

[TheOnlyFastCoder2]

mukzer, бред зачем это вообще делать . В чем смысл ?