关于我正在创建的网页的问题[重复]

Question

大家好，感谢您抽出宝贵时间回答这个问题。

在我的网站上，我一直在尝试创建三个我在 html 中完成的按钮。

在 JS 上，我创建了一个或多个数组，并尝试使用 DOM，所以每当 somsone 单击按钮时，数组中的相应项就会出现，但现在我收到的警报是未定义的。任何人都可以帮忙帮我调试一下错误？

HTML 有：

<button id ="btn-0">Button 1!</button>
<button id ="btn-1">Button 2!</button>
<button id ="btn-2">Button 3!</button>

而 JS 有：

var items = ['Sugar','Tea','Peper']
for (var btnNum=0; btnNum <items.length;btnNum++){
document.getElementbyId('btn-' + btnNum).onclick = function() {
alert(items[btnNum]);
};
}

谁能告诉我我在哪里做错了 JS 代码并在我收到未定义而不是获取数组的 hte 项时收到警报？

为这个非常新手的 JS 问题道歉！

Answer 1

var items = ['Sugar','Tea','Peper']
for (var btnNum=0; btnNum <items.length;btnNum++){
  (function(btnNum){
    document.getElementById('btn-' + btnNum).onclick = function() {
  alert(items[btnNum]);
  };
  })(btnNum)

}