Javascript 无法设置属性'；src&x27；在HTMLImageElement.changeImg中未定义的

在此代码中，当我使用[I]时，它不起作用，但如果我使用[0]或[1]而不是[I]，它就起作用。 我不明白[I]为什么不与src合作

HTML代码

    <div  class="player">
     <p >Player 1
     </p>
     <img  id="myimg" src="images/dice6.png">

    </div>
    
    <div class="player">
        <p> Player 2
        </p>
        <img  id="myimg" src="images/dice6.png">
   
    </div>

玩家1

玩家2

JS代码

var images = ["images/dice1.png","images/dice2.png","images/dice3.png","images/dice4.png","images/dice5.png","images/dice6.png"];


for (var i = 0; i < document.querySelectorAll("#myimg").length; i++){
document.querySelectorAll("#myimg")[i].addEventListener("click", changeImg);

 function changeImg(){
 var randomNumber1 = Math.floor(Math.random() * images.length);

 document.querySelectorAll("#myimg")[i].src = images[randomNumber1] ;
 }
}

var images=[“images/dice1.png”、“images/dice2.png”、“images/dice3.png”、“images/dice4.png”、“images/dice5.png”、“images/dice6.png”]；
对于（var i=0；i

不要使用ID的双精度，它们必须是唯一的。最好改用类

张学友 在eventListener中，为changeImg调用一个函数。获取随机图像并使用'this'获取实际元素并更改源。

注意：因为JS中的随机不是真正的随机，所以我添加到搜索中，只要图像与实际图像相同。否则，您有时不得不单击多个按钮进行更改。

为了进行测试，最好查看是否使用完整页面链接（在输出窗口的右上角）

var图像=[”https://media.flaticon.com/dist/min/img/home/kiranshastry.png","https://www.pokewiki.de/images/thumb/d/d5/Sugimori_848.png/250px-Sugimori_848.png","https://assets.pokemon.com/assets/cms2/img/pokedex/full/034.png","https://assets.pokemon.com/assets/cms2/img/pokedex/full/030.png"];
for（设i=0；i

玩家1

玩家2

重复的ID是无效的HTML。如果使用重复的ID，可能会导致异常行为，例如选择器无法按预期工作。首先解决这个问题。不能有多个元素具有相同的属性id@CertainPerformance我已经测试过它不工作。仍然不工作。很抱歉，我没有用图像测试过它，所以我没有看到故障。我现在改了。