我试图创建一些类型的数字生成器在网页上。 我想在生成的数字显示之前显示五个数字。 为了更好的想象，你可以看看google Generator。 当您单击generate时，在生成的数字之前显示3-4个数字。 我使用setInterval或setTimeout，但我不知道它是如何工作的。 我的js代码:
var button = document.querySelector("button");
button.addEventListener("click",function() {
for (var i = 0; i < 8; i++) {
setInterval(textC,5);
}
});
function textC(){
number.textContent = Math.floor(Math.random() * 1000) + 1;
}
谢谢你的每一次帮助！
setInterval()的问题是，除非清除，否则它将永远继续，从而导致您不断生成随机数。 相反，您可以使用setTimeout()，但将超时设置为基于for循环中的i的值进行更改。 这样，每个间隔将在另一个间隔之后50 m/s出现。
请参见下面的示例:
null
const button = document.querySelector("button");
const number = document.querySelector("#number");
button.addEventListener("click", function() {
for (let i = 0; i < 5; i++) {
setTimeout(textC, 50 * i);
}
});
function textC() {
number.textContent = Math.floor(Math.random() * 1000) + 1;
}<p id="number"></p>
<button>Generate</button>
不要使用循环。 只需嵌套setTimeout并调用它，直到达到预定义的阈值。 另见
null
var button = document.querySelector("button");
var number = document.querySelector("#number");
const nRuns = 12;
const timeout = 100;
let iterator = 0;
button.addEventListener( "click", textC);
function textC(){
number.textContent = `${Math.floor(Math.random() * 1000) + 1}\n`;
iterator += 1;
if (iterator < nRuns) {
setTimeout(textC, timeout)
} else{
iterator = 0;
}
}<p id="number"></p>
<button>Generate</button>