javascript - js按钮不更新innerhtml

我已经看过这里的许多问题，但找不到类似的问题。我正在尝试给按钮提供一个更新变量的功能（具体来说是一个数字，即-按下按钮>> 0变为1）并将其写入innerHTML的div中。它会在警报中更新，但不会更新innerHTML。

var example = 0;
var exampleDiv = document.getElementById('exampleDiv');

function buyExample() {
  example += 1;
}

exampleDiv.innerHTML = 'You have ' + example + ' examples.';

网页上显示的数字为0。

最佳答案

基于上面我的评论的工作代码：

var example = 0;
var exampleDiv = document.getElementById('exampleDiv');

function buyExample() {
  example += 1;
  exampleDiv.innerHTML = 'You have ' + example + ' example' + (example !== 1 ? 's' : '') + '.';
}

document.getElementById("incrementButton").onclick = buyExample;

<button id="incrementButton">Click me</button>

<div id="exampleDiv">You have 0 examples.</div>