我有一个plugins.init.js文件,其中的try catch在页面加载时运行。我希望在计数器值div出现时运行它。有没有办法在div出现时只运行一次
try {
const counter = document.querySelectorAll(".counter-value");
const speed = 2500; // The lower the slower
counter.forEach((counter_value) => {
const updateCount = () => {
const target = +counter_value.getAttribute("data-target");
const count = +counter_value.innerText;
// Lower inc to slow and higher to slow
var inc = target / speed;
if (inc < 1) {
inc = 1;
}
// Check if target is reached
if (count < target) {
// Add inc to count and output in counter_value
counter_value.innerText = (count + inc).toFixed(0);
// Call function every ms
setTimeout(updateCount, 1);
} else {
counter_value.innerText = target;
}
};
updateCount();
});
} catch (err) {}
1条答案
按热度按时间uubf1zoe1#
您可以使用浏览器中的交集观察器API来完成此操作。
观察器将等待指定的元素进入视图,然后在出现这种情况时执行SOM回调。
你可以阅读here。
祝你好运!