在JavaScript中，如何在按下按钮之前输出0次点击？（单击计数器）

我用JavaScript制作了一个点击计数器，现在，我想解决这个问题：

当我打开单击计数器时，输出为nothing。但按下“单击”按钮后，输出为

1

。打开单击计数器后，我想将输出更改为

0

。但还有一个问题。完成此操作后，重新加载页面后，输出将始终

0

以下是我的点击计数器代码：

document.title = 'Click Counter';

var clickButton = document.createElement('button');
var resetButton = document.createElement('button');
var output = document.createElement('p');

clickButton.innerHTML = 'Click';
resetButton.innerHTML = 'Reset';

clickButton.onclick = clickCounter;
resetButton.onclick = resetClicks;

document.body.appendChild(clickButton);
document.body.appendChild(resetButton);
document.body.appendChild(output);

function clickCounter() {
    if (localStorage.clicks) {
        localStorage.clicks = Number(localStorage.clicks) + 1;
    } else {
        localStorage.clicks = 1;
    }
    output.innerHTML = localStorage.clicks;
}

function resetClicks() {
    localStorage.clear();
    output.innerHTML = 0;
}

---

如果您的函数没有被调用过一次，则此变量的值必须为null或未定义，您可以使用“if”将0添加到输出中来处理此情况，并且在刷新页面时不会出现问题，因为单击后，该变量将具有值。我说得对吗

if (!localStorage.clicks){
    localStorage.clicks = 0;
}

---

另一个技巧是，在打开计数器时尝试获取事件并设置此事件下的值。

如果函数未被调用过一次，则此变量的值必须为null或未定义，可以使用“if”将0添加到输出中来处理此情况，刷新页面时不会出现问题，因为在单击之后，变量将具有值。我说得对吗

if (!localStorage.clicks){
    localStorage.clicks = 0;
}

---

另一个技巧是，打开计数器时尝试获取事件，并在此事件下设置值。

您可以初始化localStorage。如果尚未定义，请单击0

...
document.body.appendChild(clickButton);
document.body.appendChild(resetButton);
document.body.appendChild(output);

if (!localStorage.clicks){
    localStorage.clicks = 0;
}

function clickCounter() {
    localStorage.clicks++;
    output.innerHTML = localStorage.clicks;
}


function resetClicks() {
...

---

如果尚未定义，则可以将localStorage.clicks初始化为0

...
document.body.appendChild(clickButton);
document.body.appendChild(resetButton);
document.body.appendChild(output);

if (!localStorage.clicks){
    localStorage.clicks = 0;
}

function clickCounter() {
    localStorage.clicks++;
    output.innerHTML = localStorage.clicks;
}


function resetClicks() {
...

---

如果您总是想在

0

启动它，为什么要使用

localStorage

？@StackSlave我不想在

0

启动它@StackSlave我想在按下按钮之前输出

0

。

output.textContent=0不在函数中。如果您总是想在
0
启动它，为什么要使用
localStorage
？@StackSlave我不想在
0
@StackSlave启动它，我想在按下按钮之前输出
0
。
output.textContent=0不在函数中。