按钮点击计数功能失效，报错Uncaught ReferenceError: cnt is not defined求助

问题根源 #

1. 严格模式下未声明变量报错：开启"use strict"后，未用let/const/var声明的变量直接赋值会抛出ReferenceError，你的代码里cnt = 0属于未声明变量赋值，触发了这个错误。
2. 计数逻辑无效：每次点击按钮都重置cnt = 0，执行cnt++后永远是1，根本无法实现累计计数。
3. DOM元素操作错误：<span>是普通文本元素，没有表单元素的value属性，用value赋值不会生效，得用文本内容相关属性。

修正后的代码 #

HTML（保持原结构即可，无需修改）

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Make777</title>
  <link rel="stylesheet" href="./style.css">
</head>
<body>
  <button type="button" class="btn-click" onclick="dongjak_button();">CLICK</button>
  <span>You Clicked This Button <span id="number"></span>Times!!!!!!</span>

  <script src="./script.js"></script>
</body>
</html>

JavaScript（核心修改）

"use strict";

// 将计数变量声明在函数外部，确保每次点击能累计数值
let cnt = 0;

function dongjak_button(){
    cnt++;
    // 用textContent设置span的文本内容，替代无效的value属性
    document.getElementById("number").textContent = cnt;
}

更优雅的写法（推荐） #

如果想避免内联onclick的代码耦合问题，可以改用事件监听：

修改后的HTML

<button type="button" class="btn-click">CLICK</button>

修改后的JavaScript

"use strict";

let cnt = 0;
// 提前获取DOM元素，避免每次点击重复查询DOM
const clickBtn = document.querySelector(".btn-click");
const numberDisplay = document.getElementById("number");

clickBtn.addEventListener("click", () => {
    cnt++;
    numberDisplay.textContent = cnt;
});

内容的提问来源于stack exchange，提问作者Lim