如何实现点击按钮递增Div数值的计数器？现有代码点击后数值不更新的问题排查

你的核心问题出在对Div元素的属性使用错误上——Div元素没有value属性，你在numberChanged()函数里用refthrow.value去读取数值，得到的结果是NaN（非数字），这就导致后续的递增逻辑完全失效了。

修正步骤拆解： #

• 第一步：获取Div当前的数值时，应该用refthrow.innerHTML代替refthrow.value，因为Div的内容是通过innerHTML渲染的。
• 第二步：添加容错处理，避免Div初始内容不是数字的情况（比如空内容时默认设为0）。
• 第三步：可简化冗余逻辑，让代码更简洁直观。

修正后的完整代码： #

HTML部分（与原代码一致，无需修改）：

<div class="elements" id="txtthrow">0</div>
<button class="button1" id="buttonNewHand" onclick="newFaceTot()">new<br>number</button>

JavaScript部分：

const refthrow = document.getElementById("txtthrow");

function newFaceTot(){
    numberChanged();
}

function numberChanged(){
    // 读取Div当前内容并转成数字，非数字时默认设为0
    let num = parseInt(refthrow.innerHTML, 10) || 0;
    // 调用递增函数并更新Div内容
    refthrow.innerHTML = changeNumber(num);
}

function changeNumber(num){
    return num + 1;
}

额外优化建议： #

你可以把冗余的函数合并，直接在点击事件里完成所有逻辑，代码更简洁：

const refthrow = document.getElementById("txtthrow");

function newFaceTot(){
    let currentNum = parseInt(refthrow.innerHTML, 10) || 0;
    refthrow.innerHTML = currentNum + 1;
}

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