按钮以制作框并在其中添加计数的数字

问题描述

我无法启动。我正在尝试制作一个“添加框”按钮，该按钮将在每次单击时向容器添加一个新框。但我还需要框内显示的数字。例如，当我单击一次时，一个框显示为1，然后第二个框显示2，依此类推。我不确定如何在js中组合它们。

解决方法

开始。试试这个演示。 https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onclick

这里有一个代码，可以添加Hello World Text。更改代码以创建一个框。

由于您未包含任何代码，所以我只能猜测。但是我认为您的意思是这样的：

var boxes = 1;
var addBox = function(){
    document.getElementsByClassName("boxes")[0].innerHTML += "<div>Box " + boxes + "</div>";
    boxes++;
};

window.addEventListener("load",function(){
    document.getElementsByClassName("addBox")[0].addEventListener("click",addBox);
});

<button class="addBox">Add Box</button>

<hr>

<div class="boxes"></div>

这段代码只是一个如何完成它的简单示例。
我基本上只是创建一个计数器变量，并在每次执行addBox()函数时将其递增。

counter dom html javascript