JavaScript中实现函数为变量增加值的方法及代码问题排查

你的代码存在两个核心问题，导致点击按钮后分数无法正常更新甚至显示异常：

1. 变量更新语法错误
   函数内的var points + 25;是无效语法，且错误地用var重新声明了局部变量，会覆盖全局的points变量。正确的累加写法应该是直接对全局变量进行赋值操作：

   points += 25; // 等价于 points = points + 25;
   

2. 未同步更新页面显示
   你仅在初始化时设置了一次分数的页面显示，点击按钮修改points变量后，没有重新更新DOM元素的内容，所以页面不会同步展示新的分数值。

修复后的完整代码：

<button onclick="addPoints25()">done</button>
<p id="counter"></p>

<script>
let points = 0;
// 抽离更新显示的逻辑，避免重复代码
function updateCounter() {
    document.getElementById("counter").innerHTML = points;
}
// 初始化显示初始分数
updateCounter();

function addPoints25() {
    // 直接累加全局变量，无需重新声明
    points += 25;
    // 更新页面显示最新分数
    updateCounter();
}
</script>

额外优化提示：

• 用let替代var可以避免变量提升带来的潜在问题（支持ES6及以上环境）
• 若要避免全局变量污染，可将代码包裹在立即执行函数中

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