Получение значения из id и кликнуть

Question

Прошу помощи в написании скрипта.

Есть такой код на странице:

<b id="total">552</b>

Для поиска использую

document.getElementById('total');

Результат

<b id="total">552</b>

Вопрос, с помощью какой функции провести сравнение полученного значения? Например, если 552 < 1000 значит ничего не делаем и ждем, если значение total стало 1000 и более, тогда делаем клик по нужному элементу. Как и куда сделать клик уже мне известно. Заранее благодарю за помощь.

Answer 1

Можно просто ждать в асинхронном цикле(setInterval)

const el = document.getElementById('total');
let modifying = setInterval(() => {
  el.dataset['i'] = ('i' in el.dataset ? +el.dataset['i'] : 0)+1;
  el.innerText = Math.round(Math.abs(2000*Math.sin(el.dataset['i'] / 10)));
}, 300);

///////////////

let waiting = setInterval(() => {
  const total = +el.innerText;
  if (!el.dataset['state']) el.dataset['state'] = total >= 1000 ? 'gt' : 'lt';
  
  if (el.dataset['state'] === "lt" && total >= 1000) {
    el.dataset['state'] = 'gt';
    console.log('>= 1000'); 
  }
  if (el.dataset['state'] === "gt" && total < 1000) {
    el.dataset['state'] = 'lt';
    console.log('< 1000'); 
  }
}, 300);

<b id="total">2000</b>

Answer 2

Можно при изменении генерировать событие, и подписаться на него.

Причём проверку значения можно делать, как в обработчике события, так и перед генерацией события.

const el = document.getElementById('total');
let modifying = setInterval(() => {
  el.innerText = +el.innerText + 3;
  el.dispatchEvent(new CustomEvent('valueChanged', {detail: +el.innerText}));
  if (el.innerText > 1000) {
    el.dispatchEvent(new CustomEvent('valueGT100'));
  }  
}, 50);

///////////////
el.addEventListener('valueChanged', (ev) => {
  if (ev.detail >= 1000) {
    clearInterval(modifying);
    console.log('click!');
  }
});

el.addEventListener('valueGT100', () => {
  console.log('click again!');
});

<b id="total">752</b>

БЛОГ НА HUSL

Получение значения из id и кликнуть

Ответы (2 шт):