setIntervalを使うときの注意点

イベントが何回も設定されないように工夫する必要がある．

setIntervalを使った事例

function check () {
  const 要素 = document.getElementById("Id名")
  要素.addEventListener("click", () => {

  });
}
setInterval(check, 1000)

setIntervalとは一定の間隔で関数を実行したいときに使う．第1引数には関数名を，第2引数には関数を実行する間隔を指定する．このとき，間隔の単位はmsであることに注意する．上記のコードでは，1秒に1回check関数が実行されることになる．この場合，1秒に1回要素にclickイベントが設定されるため，要素をクリックした際に何回も関数が実行されてしまう．このようなことを回避するには，要素に対して初めてcheck関数が実行されたときにその要素に属性を付けておく必要がある．印付けのようなもの．

function check () {
  const 要素 = document.getElementById("Id名")
  if (要素.getAttribute("属性名") != null {
    return null;
  }
  要素.setAttribute("属性名", "属性値");
  要素.addEventListener("click", () => {

  });
}
setInterval(check, 1000)

上記のようにclickイベントの前に要素に属性をセットし，それを元にif文を実行すると何回もイベントがセットされることを回避することができる．

このため，setIntervalを使うときは気をつけないといけない．