读取 div 并检查点击条件-解网

问：

let timer    = document.querySelector("#timer");
var counter = 3;

function myFn() {
  counter--
  if (counter === -1) {
    counter = 3
  }
  timer.innerText = counter
}

btn.onclick = function() {
  text.innerHTML += 'clicked' + '<br>'
}

var myTimer = setInterval(myFn, 1000);

<div id="timer"></div>
<button id="btn">Button</button>
<div id="text"></div>

我正在尝试使用这个小代码读取每秒并在控制台.log F12 中检查单击条件。它在我尝试做的每一种方式上都给了我不同的错误。div#timer

let timer = document.querySelector("#timer");
let btn = document.querySelector("#btn");

setInterval(() => {
  console.log(timer.textContent)
  if (timer.textContent === '0') {
    btn.click()
  }
}, 1000);

JavaScript jQuery 构造函数回调间隔

$(function() {
  var timer = 0;
  var counter = 3;
  var timeObj = $("#timer");
  var btnObj = $("#btn");
  var txtObj = $("#text");
  var interval;

  function myFn() {
    if (--counter >= 0) {
      txtObj.append("Clicked<br />");
    } else {
      clearInterval(interval);
    }
  }

  interval = setInterval(function() {
    timeObj.html(++timer);
  }, 1000);

  btnObj.click(myFn);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="timer">0</div>
<button id="btn">Button</button>
<div id="text"></div>

你会想要使用而不是.setInterval()setTimeout()

该方法在 Window 和 Worker 接口上提供，可重复调用函数或执行代码片段，每次调用之间有固定的时间延迟。setInterval()

此方法返回唯一标识间隔的间隔 ID，因此您可以稍后通过调用将其删除。clearInterval()

在变量之前使用 and 也将在使用之前应用更改。--++

递减运算符（）递减（从中减去 1）其操作数，并返回递减之前或之后的值，具体取决于运算符的放置位置。--

调整此处的逻辑还可以确保按钮单击确实允许用户继续执行操作。

下一个：一个回调 Javascript 的一个实例

读取 div 并检查点击条件

read div and check for a click condition

评论