javascript - 点击次数达到 X 后执行某项操作

Question

我有一个基本的点击计数器(desc)，它工作得很好，但是一旦达到 X，你如何让它做一些事情？

JS:

var clicks = 20;
 function clicker() {
   clicks--;
    document.getElementById("clicks").innerHTML = clicks;
}

HTML:

<button type="button" onClick="clicker()">Click me</button>
    <p>Clicks: <a id="clicks">20</a></p>

我已经尝试过函数内部和外部的 if 语句，但它不起作用:

if (clicks == 10) {
    document.getElementById("p").innerHTML = "finished";
}

Answer 1

您正在尝试选择一个 id 为 p 的元素，该元素在您提供给我们的代码中不存在。我相信您正在尝试选择 p 元素，在这种情况下您可以使用 document.querySelector('p') 或 document.getElementsByTagName('p ')[0].

请注意，这两者都会选择文档中的第一个 p 元素，这可能不是您想要的。您必须有一个更具体的标识符，例如类或 ID。

请注意，通过 document.querySelector('...')，您可以使用 CSS 样式选择器，因此请使用 #id 选择 ID。

var clicks = 20;

function clicker() {
  clicks--;
  document.getElementById("clicks").innerHTML = clicks;

  if (clicks == 10) {
    document.querySelector("p").innerHTML = "finished";
  }
}

<button type="button" onClick="clicker()">Click me</button>
<p>
  Clicks: <a id="clicks">20</a>
</p>