Javascript 如何多次添加变量？

我一直在努力使它，使你点击一个按钮，它增加了金额完成！那么你是如何做到多次的呢？如中所示，如何每次添加1？这是到目前为止我所掌握的一些javascript：

function stickAmount() {
    var y = 1;
    var stickNo = document.getElementById("stickNumber");
    stickNo.innerHTML = "Sticks: " + y;
}

以及HTML：

<div id="stickNumber" style="margin-left:10px; margin-top:10px;"></div>

---

我已经建立了一个快速的JSFIDLE来演示如何实现它

HTML

主要的事情是为增加棍棒数量的函数之外的棍棒数量定义变量

---

我将“Sticks:”移到HTML中，因为您只需要更改数字。

move

y

declaration outside

stickAmount

因为变量是在函数内部声明的，它将有一个局部范围，因此每次调用函数时都会被赋予值1。您可以在函数外部声明

y

，使其在函数调用之间保持其值。为什么

HTMLElement

上声明

parseInt（）

？我正要发布一个演示：）

function stickAmount()
{
var y=1;
var stickNo=parseInt(document.getElementById("stickNumber"));
stickNo.innerHTML="Sticks: "+y;
}


setInterval("stickAmount()",500)

var y=1  // move the variable outside of the function
function stickAmount()
{

var stickNo=document.getElementById("stickNumber")
stickNo.innerHTML="Sticks: "+y;
y++ // increment y by 1 every time the function is called
}

Sticks: <span id="NumberOfSticks"></span>

<button id="AddStickButton">Add</button>

var numberOfSticks = 1;

var numberOfSticksSpan = document.getElementById("NumberOfSticks");
numberOfSticksSpan.innerHTML = numberOfSticks;

function addStick() {
    numberOfSticks++;
    numberOfSticksSpan.innerHTML = numberOfSticks;
}

var addStickButton = document.getElementById("AddStickButton");
addStickButton.addEventListener("click", addStick, false);