使用闭包实现点击每个按钮,按钮中的数字都是单独递增的,互补影响
时间: 2024-01-21 12:16:05 浏览: 90
可以使用闭包来实现这个功能。首先,我们可以创建一个函数,用来生成按钮。
```javascript
function createButton() {
let count = 0; // 计数器
const button = document.createElement('button');
button.innerText = count;
button.addEventListener('click', () => {
count++;
button.innerText = count;
});
document.body.appendChild(button);
}
```
在该函数中,我们定义了一个计数器 `count`,然后创建了一个按钮元素,并将其初始文本设置为 `count` 的值。接下来,我们为按钮添加了一个点击事件监听器,每次点击时将 `count` 的值加1,并将按钮文本更新为新的值。
接着,我们可以在全局作用域中调用 `createButton` 函数来生成多个按钮:
```javascript
createButton();
createButton();
createButton();
```
由于每个按钮都有自己的闭包作用域,因此它们之间不会相互影响,每个按钮中的数字都会单独递增。
阅读全文