计数器代码，但是它在页面加载后开始工作，我想在该部分可见时使用它：-
$(document).ready(function() {
var counters = $(".counter");
var countersQuantity = counters.length;
var counter = [];
for (i = 0; i < countersQuantity; i++) {
counter[i] = parseInt(counters[i].innerHTML);
}
var count = function(start, value, id) {
var localStart = start;
setInterval(function() {
if (localStart < value) {
localStart++;
counters[id].innerHTML = localStart;
}
}, 80);
}
for (j = 0; j < countersQuantity; j++) {
count(0, counter[j], j);
}
});
$(document).ready(function() {仅在初始DOM完全加载后才运行回调。在大页面上，这可能需要一段时间才能让用户看到初始元素。
确保上面包含jQuery（可能在<head>中），然后在HTML中的最后一个.counter元素之后，立即放置一个脚本标记，以便在DOM中创建该元素后立即运行，而无需等待页面的其余部分加载：
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>content</div>
<div>content</div>
<div class="counter">100</div>
<div class="counter">200</div>
<div class="counter">300</div>
<div class="counter">400</div>
<script>
var counters = $(".counter");
var countersQuantity = counters.length;
var counter = [];
for (i = 0; i < countersQuantity; i++) {
counter[i] = parseInt(counters[i].innerHTML);
}
var count = function(start, value, id) {
var localStart = start;
setInterval(function() {
if (localStart < value) {
localStart++;
counters[id].innerHTML = localStart;
}
}, 80);
}
for (j = 0; j < countersQuantity; j++) {
count(0, counter[j], j);
}
</script>
<div>content</div>[请注意，如果愿意，您可以显着清理代码，并且不需要像jQuery这样的大库就可以选择元素：
<div>content</div>
<div>content</div>
<div class="counter">100</div>
<div class="counter">200</div>
<div class="counter">300</div>
<div class="counter">400</div>
<script>
for (const counter of document.querySelectorAll('.counter')) {
const target = Number(counter.textContent);
counter.textContent = 0;
const interval = setInterval(() => {
const curr = Number(counter.textContent);
if (curr < target) counter.textContent = curr + 1;
else clearInterval(interval);
}, 80);
}
</script>
<div>content</div>