如何通过单击按钮更改Javascript中的src来更改多个图像

我对web开发完全是新手，正在尝试学习和练习Javascript。 我已经学会了一个技巧，通过改变图像的src来改变显示的图像（它们被命名为：pic-0.jpg，pic-1.jpg，pic-2.jpg…等等），但不知何故我的代码无法工作。 任何人都可以看看我的代码，帮助我，给我一些建议。我会很感激的

代码如下：

var计数器=0；
document.getElementById（'btn-next'）。addEventListener（'click'，changeImg）；
函数更改img（）{
计数器++；
document.getElementById（'picture'）.src='pic-'+counter+'.jpg'；
}

以前的
下一个

您使用的是getElementsById，您应该使用getElementById，因为id总是唯一的，一个页面只能有一个id，您可以使用getElementsByClassName，因为类可以附加多个标记

var计数器=0；
document.getElementById（'btn-next'）。addEventListener（'click'，changeImg）；
函数更改img（）{
计数器++；
document.getElementById（'picture'）.src='pic-'+counter+'.jpg'；
document.getElementById（'picture'）.alt='pic-'+counter+'.jpg'；
}

以前的
下一个
//---------------------JavaScript-----------------

以前的
下一个
var计数器=1；
document.getElementById（'btn-next'）。addEventListener（'click'，nextImg）；
document.getElementById（'btn-previous'）。addEventListener（'click'，preImg）；
函数nextImg（）{
计数器++；
document.getElementById（'picture'）.src='10〕https://i.picsum.photos/id/“+计数器+”/5616/3744.jpg'；
}
函数preImg（）{
计数器--；
document.getElementById（'picture'）.src='10〕https://i.picsum.photos/id/“+计数器+”/5616/3744.jpg'；
}

我认为最好的办法是将所有图像路径存储到一个数组中。然后

var imgArr = ["1.jpg", "2.jpg"]
var counter = 0;

function changeImg(evt) {

  if(evt === 'prv'){
    if(counter === 1)
      counter++;
    else
      counter--;
  }
  else{
     if(counter === (imgArr.length))
        counter = 1;
     else
        counter++;
  }

  document.getElementById('picture').src = imgArr[counter]; 


}




<section class="container">
  <div class="picture-container">
    <img src="" id="picture" alt="">
  </div>
  <button id="btn-previous" onClick="changeImg('prv')">Previous</button>
  <button id="btn-next" onClick="changeImg('nxt')">Next</button>
</section>

var imgArr=[“1.jpg”，“2.jpg”]
var计数器=0；
功能更改IMG（evt）{
如果（evt=='prv'）{
如果（计数器==1）
计数器++；
其他的
计数器--；
}
否则{
如果（计数器==（imgArr.length））
计数器=1；
其他的
计数器++；
}
document.getElementById（'picture'）.src=imgArr[counter]；
}
以前的
下一个

getElementById不是元素，请参阅下面修改的代码哦，很抱歉我输入错误！谢谢你指出这一点。我已经编辑了它，但仍然没有工作。它工作你可以运行我的代码片段，并与你的代码匹配，为了更好地理解我改变了它的alt属性！还有我的密码！真奇怪，伙计。我尝试将事件的分配切换到上一个按钮，结果成功了。我去控制台再次检查，没有看到分配给NEXT按钮的事件。过了一会儿，我关闭了正在处理的JS文件窗口并重新打开。两者都使用相同的代码！无论如何谢谢你！这个很好用，谢谢你，伙计！我的代码在一段时间后也工作了！谢谢我也读过一些，我认为这是一个更好的解决方案。但我只是想弄明白“为什么那不管用”，因为我正在学习和测试。谢谢