想使用每1秒运行一次的infinte循环使用普通javascript来更改html网页中的文本，但是加载时网页卡住了

Question

我有一个HTML代码段

和用于处理更改的javascript文件

const slideTitleArr =['financial Services', 'Management Services'];

function slidingTitle() {
    for (let i = 0; i>-1; i++) {
        if (i === slideTitleArr.length) {
            i=0;
        }
        setTimeout(function timer() {
            document.getElementById('sliding-title').innerHTML = slideTitleArr[i];
        }, i*1000);
    } 
}

window.onload =  slidingTitle()

<h1>Trailblazing CRM  for <span id="sliding-title"style="color: white">financial services</span> </h1>

我不知道为什么这行不通。

Answer 1

它崩溃是因为您创建了一个无限循环（i>-1），该循环使setTimeout无法运行（here is useful post on the JS event loop/call stack）。您正在寻找setInterval。 setInterval将每隔setInterval()秒调用一个函数。

n

const slideTitleArr = ['financial Services', 'Management Services'];
let i = 0;
setInterval(() => {
  i = i >= slideTitleArr.length - 1 ? 0 : i + 1;
  document.getElementById('sliding-title').innerHTML = slideTitleArr[i];
}, 1000);