Javascript 有没有更简单的方法在JS中应用实时选择？ const btnList=[ { id:'所有'， 内容：“全部” }, { id:'br'， 内容：“早餐” }, { id:'dn'， 内容：“晚餐” } ]; window.addEventListener（'load'，（）=>{ const btnz=document.getElementById（'btnz'）； 让newBtn=''； btnList.forEach（btn=>{ newBtn+=`${btn.content}` }) btnz.innerHTML=newBtn； }); const btnCollection=document.getElementsByClassName（“btn项”）； console.log（btnCollection.length）；

这是HTML：

const btnList = [
    {
        id: 'all',
        content: 'All'
    },
    {
        id: 'br',
        content: 'Breakfast'
    },
    {
        id: 'dn',
        content: 'Dinner'
    }
];
window.addEventListener('load', () => {
    const btnz = document.getElementById('btnz');
    let newBtn = '';
    btnList.forEach(btn => {
      newBtn += `<button id="${btn.id}" class="btn-item">${btn.content}</button>`
    })
    btnz.innerHTML = newBtn;
});
const btnCollection = document.getElementsByClassName("btn-item");
console.log(btnCollection.length);

---

我想创建动态按钮，然后使用forEach（）函数检查新创建的按钮。它给了我一个错误，所以我尝试了log btnCollection.length，出于某种原因，它返回我“0”而不是“3”。为什么？

在

onload

函数的末尾移动此行：

console.log（btnCollection.length）。现在，您正在记录创建按钮之前的数量。同样，我不需要在创建按钮之前查看，因为它只是上面提到的简单div。相反，我需要了解如何在btnz div中检查按钮集合的“实时”版本
<div id="btnz"></div>