Смена картинок по нажатии на кнопку?

Question

[SaberChazer]

Добрый день, подскажите как найти или сделать так, чтобы при нажатии на кнопку менялись картинки (их 3).
Например, пользователь видит 1 картинку прочитал на ней что-то нажал на кнопку и ту 1 картинку заменяет 2 фотография вновь прочитал что-то, нажал на кнопку и 2 фотографию заменяет 3.
из кода ничего особенного

Answer 1

[Артём Буханец]

<div class="pic">
  <img src=""> 
</div>

<button data-src="путь к изображению">
  изображение 1
</button>

<button data-src="путь к изображению">
  изображение 2
</button>

<button data-src="путь к изображению">
  изображение 3
</button>

document.body.addEventListener('click', e => {
  if (!e.target.matches('button')) return
  document.querySelector('.pic img').src = e.target.dataset.src
  
  document.querySelectorAll('button').forEach(btn => btn.classList.remove('active'))
  e.target.classList.add('active')
})

Answer 2

[Алексей]

Сначала составляете массив из ваших картинок, туда вставляете пути к ним.
Далее объявляете кнопку и блок с картинкой куда будете вставлять путь
По клику на кнопку вставляете картинку и при каждом клике увеличиваете переменную на 1, если переменная равна или больше кол-во картинок - обнуляете

Answer 3

[Noder SS]

Меняйте аттрибут src