如何在JavaScript中选择生成的元素[重复]

Question

此问题已经在这里有了答案：

Event binding on dynamically created elements?（23个答案）

关闭4分钟前。

当我单击start时，将显示一些选择。

我想通过getElementById选择每个选项吗？

如何更改工作以实现目标？

谢谢

      
    document.getElementById("start").addEventListener('click',function(){
      html=" ";
      for (let i=1;i<=4; i++){
        html+= "<button id='choice'>"+"choice"+i+"</button><br>";
      }
      document.querySelector('.btn').innerHTML = html;
      });
      
      document.getElementById("choice").addEventListener('click',function(){
        console.log(this);
      });

<div class ="btn"><button id="start">start</button></div>

Answer 1

您可以尝试以下方式：

    document.getElementById("start").addEventListener('click',function(){
      html=" ";
      for (let i=1;i<=4; i++){
        html+= `<button id=choice${i}>choice${i}</button><br>`;
      }
    document.querySelector('.btn').innerHTML = html;

          document.querySelectorAll("[id*=choice]").forEach(function(el){
          el.addEventListener('click',function(){
      console.log(this);
    });
    });

});
      

<div class ="btn"><button id="start">start</button></div>