BodyaFlesh
@BodyaFlesh
Front-End Developers

Как правильно перебрать querySelectorAll?

Помогите реализовать такую задачу, есть страница на данной странице есть N количество блоков, в каждом этом блоке есть кнопка и текст при нажатии на данную кнопку должен извлекается текст и доставляться в . Есть скрипт но он работает только если такая кнопка одна. Подскажите как перебрать все эти кнопки которые в "querySelectorAll" чтобы работало для всех кнопок.
Вот пример реализованный для одной кнопки:
https://jsfiddle.net/BodyaFlesh/vwyvsx9z/
Реализовать нужно именно на чистом JS.
Заранее спасибо за помощь.
  • Вопрос задан
  • 7855 просмотров
Решения вопроса 2
miraage
@miraage
Старый прогер
Решать за Вас не буду, но подскажу.

1) Получаете элементы через querySelectorAll
2) Преобразуете в массив - Array.prototype.slice.call(result)
3) Идете циклом forEach и вешаете обработчик на каждый элемент
Ответ написан
petermzg
@petermzg
Самый лучший программист
var but = document.querySelectorAll('div > .click');
for (var b in but)
but[b].onclick = function(){
  var father = this.parentNode;
  var a = father.querySelector('h2').innerHTML;
  document.querySelector('div#modal input').value = a;
};
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@MrCheater
Full-Stack JS. В прошлом программист-олимпиадник
caniuse.com/#feat=queryselector не работает на некоторых safari, неочень старом андроиде и ещё кое-где.
Ответ написан
Комментировать
pm_wanderer
@pm_wanderer
junior-HTML
Если кнопок будет не очень много на странице, то можно просто в хтмл написать у кнопки аттрибут: onclick="myFunction(this)"
myFunction(but) в джаваскрипте соответственно будет получать кнопку из которой можно внутри функции достать innerHTML и делать с ним что угодно дальше.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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