使用parseInt实现H1标签数值随输入框递增失效问题排查求助

嘿，你的问题主要出在两个细节上，都是关于parseInt()的使用和变量赋值的问题，我来帮你拆解清楚：

1. parseInt()的参数传递错误 #

你写的parseInt('h1Value')是把**字符串"h1Value"**传给了parseInt，而不是变量h1Value本身。字符串"h1Value"不是有效数字，这行代码会直接返回NaN（非数字），完全达不到数值计算的目的。同理，parseInt('changeH1By')也是一样的错误——变量名不需要加引号。

2. 未将计算结果赋值回变量 #

就算你正确调用了parseInt，你只是执行了parseInt(h1Value) + parseInt(changeH1By)这个计算，但没有把结果存回h1Value里，所以原变量的值始终是初始的0，自然不会更新到H1标签中。

修正后的完整代码 #

<h1 id="h1">0</h1>
<input type="number" id="input" value="1">
<button onclick="addFun()">Add</button>

<script>
var h1Value = 0;
function addFun() {
  // 获取输入框值并转成数字，用|| 0处理空输入的异常情况
  var changeH1By = parseInt(document.getElementById('input').value, 10) || 0;
  // 将计算结果赋值回变量
  h1Value += changeH1By;
  // 更新H1标签内容
  document.getElementById('h1').innerHTML = h1Value;
}
</script>

额外优化提示 #

• 给parseInt加上第二个参数10（十进制），可以避免某些特殊场景下的进制解析问题（比如开头带0的数字被误判为八进制）。
• 用|| 0是为了防止用户清空输入框时，parseInt返回NaN导致计算出错。

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