javascript将子元素添加到多个元素中

我的

appendChild

有问题。在下面的代码中，我试图通过循环向div添加多个按钮元素，但只得到一个按钮。我知道appendChild的工作原理。在developers.mozilla中，据说，如果元素已经存在，它将从其父元素中删除并重新设置。这就是我不能向节点添加多个相同元素（按钮）的原因

所以我的问题是，什么是实现这一目标的最佳方式

函数幻灯片（）{
此.currentStep=0；
这个时间=2000；
this.images=[]；
this.images[0]=“images/image1.jpg”；
this.images[1]=“images/image2.jpg”；
this.images[2]=“images/image3.jpg”；
this.images[3]=“images/image4.jpg”；
this.images[4]=“images/image5.jpg”；
设ImageScont=this.images.length；
让indicatorContainer=document.createElement（'div'）；
indicatorContainer.classList.add（'slide-indicator'）；
让buttonIndicator=document.createElement（'button'）；
buttonIndicator.classList.add（'button-indicator'）；
buttonIndicator.setAttribute（'type'，'button'）；
对于（设i=0；i

以前的
下一个
在您的方法中，您在每个循环迭代中分配相同的
按钮指示器
，而不是创建任何新的。您需要做的是在每个循环迭代中创建新按钮，使其按您想要的方式工作

因此，这应该是可行的：

    for (let i = 0; i < imagesCount; i+=1) {
        let buttonIndicator = document.createElement('button');
        buttonIndicator.classList.add('button-indicator');
        buttonIndicator.setAttribute('type', 'button');
        indicatorContainer.appendChild(buttonIndicator);
    }

for（设i=0；i

另外，使用
const
而不是
let
更有意义，因为您不需要重新设计这些变量。
使用：

这是因为您在循环中附加了相同的
按钮指示器。要使其工作，您应该在每个循环迭代中创建新元素move
let buttonIndicator
以及循环中的关联代码。
indicatorContainer.appendChild(buttonIndicator.cloneNode());