Дмитрий Дербенев, если будет возможность расскажу больше, более идеальный вариант, pygame говорил про data атрибуты, как раз хороший вариант, без лишней мороки, плюс можно сделать прослушку события на родителе, и через объект события вытаскивать данные, вечером постараюсь написать вариант этот с комментариями.
pygame, Bhudh, Прям перед вами написал: "Сразу скажу, по-хорошему код можно еще улучшить."!!! Я вечером уставший пил чай и решил подсказать человеку, хоть в общих чертах. Человек только учиться, вряд-ли он сейчас умеет ес6,с бэйблом работать, в прототипы лезть. Вариант с дата очень даже, можно было бы предложить. Возьмите и напишите свой ответ. Раскритиковали, будто я на продакшен код написал) Я понимаю, сколько памяти в никуда и прочее, но я не на заказ это делаю, а просто написал рабочий вариант, и описал нюансы, почему indexOx не функция и так далее. Пусть посмотрит, что такое разные типы объектов, что обработчик принимает ивент, что вешать события надо с помощью цикла и не на onclicj, а с помощью addEventList... Сразу грузить его делегированием, прототипами, спред операторами, тоже на мой взгляд жестко.
Прокомментирую код. В общем, создаем переменные, в которых будут объекты дом. Один для вывода результата, второй для перебора. Смысл такой, что при клике мы с помощью метода indexOf можем узнать номер элемента массива, НО! querySelectorAll возвращает нам объект не типа array, а nodeList, и у него нет метода indexOf, поэтому я переписал массив элементов. Далее повесил обработчик события, который по умолчанию принимает объект события. Обработчик смотрит индекс элемента по которому кликнули и записывает все это в див с классом рес.
Dima Polos
@dimovich85 Автор вопроса, куратор тега JavaScript
Спасибо, а сами компоненты изнутри базируются на html/css/js? Могу ли я внешний вид менять с помощью стилей, например css? Логику компонента изменить возможно?
Спасибо, за ответ, больше!
Zombie42679, querySelector возвращает ровно один элемент, самый первый из найденных, а у Вас querySelectorAll, который возвращает массив из всех элементов, которые найдутся по селектору. Получив только родителя повесить надо на него один eventListener, и в функцию-обработчик надо передать event, из которого, внутри функции, можно достать event.target, и с ним работать, это будет тот элемент, который событие сгенерировал.
Есть девтулз в браузере, смотрите там, что сверху у этого блока, что снизу, какие свойства применяются, пробуйте отключать свойства, включать и так далее, в результате все найдется и можно поправить.
Установить, лучше. Надо к дизайнеру обратиться, чтобы он прислал шрифты. Можно верстать дальше с поправкой, что шрифты другие, но это на грани, лучше так не делать, а то потом правки будут.
