javascript - 如何使用innerHTML 增加结果

Question

我有我的代码设置，我只是无法在每次单击 processUserText 按钮时增加结果数，有人可以指出我正确的方向吗？

function userHTML() {
    var uput = document.getElementById('uput').value;
    var num=1; 
    num = num ++;
    var html = num +  '.' + uput + '<br>' ;  
    //document.getElementById('result').innerHTML = html;
    document.getElementById("results").innerHTML += html;
} 
document.getElementById("processUserText").onclick = function() {

}
document.getElementById("reset").onclick = function(){  
    document.getElementById("results").innerHTML = "";
}
document.getElementById('processUserText').addEventListener("click", userHTML);

HTML:

<input name="uput" id="uput" type="text" size="50" placeholder="Enter your input!"/>
<input type="button" value="processUserText" id="processUserText">
<input type="button" value="Reset" id="reset">
<div id="results"></div>

Answer 1

您必须在函数外部声明 num 变量。如果它是在函数内部声明的，则在函数调用之间不会保留其值。

而不是

function userHTML() {
    var num = 1;
    num++;
    // get user input and show new value
}

做这样的事情

var num = 1;
function userHTML() {
    // get user input and show new value
    num++;
}

此外，行num = num++;实际上并不增加num。您所需要做的就是num++。其原因是 num++(称为后增量)和 ++num(前增量)之间的细微差别。此代码说明了差异:

var a = 1;
console.log(a++); // 1
console.log(a); // 2

var b = 1;
console.log(++b); // 2
console.log(b); // 2