[英]div element not changing its text content
在一个css文件中是一些文本,我想动态更改div
元素的文本内容(首先显示第一个文本,然后显示第二个文本,等等),问题是即使我看到console.log(message[i].text)
具有文本(即"Insert the FIRST text you want."
等), document.getElementById("background").innerHTML = message[i].text;
仍然是空的。
这是css文件:
const message = [
{
"text":"Insert the FIRST text you want."
},
{
"text":"Insert the SECOND text you want."
},
{
"text":"Insert the THIRD text you want."
},
{
"text":"Insert the FOURTH text you want."
},
{
"text":"Insert the FIFTH text you want."
},
{
"text":"Insert the SIXTH text you want."
},
{
"text":"Insert the SEVENTH text you want."
},
{
"text":"Insert the EIGHTH text you want w this is just to test the words w ww www."
}
]
这是js函数:
function insertText(a, b){
(function theLoop (i) {
setTimeout(function () {
document.getElementById("background").innerHTML = message[i].text;
if (i++ < b-1) {
theLoop(i);
}
else {
i = a;
//theLoop(i);
}
}, delayValue);
})(a, b);
}
这就是我所说的:
var l = message.length;
insertText(0, l);
我确定这很容易,但我无法弄清楚。 非常感谢。
由于您没有提供诸如HTML
之类的问题的详细信息,因此您将遇到的错误(如果有的话)真的很难回答。
尽管我可以通过添加一个HTML
元素并在setTimeout()
设置delayValue
的值来处理您的代码。
请尝试以下操作:
const message = [ { "text":"Insert the FIRST text you want." }, { "text":"Insert the SECOND text you want." }, { "text":"Insert the THIRD text you want." }, { "text":"Insert the FOURTH text you want." }, { "text":"Insert the FIFTH text you want." }, { "text":"Insert the SIXTH text you want." }, { "text":"Insert the SEVENTH text you want." }, { "text":"Insert the EIGHTH text you want w this is just to test the words w ww www." } ] function insertText(a, b){ (function theLoop (i) { var delayValue = 1000; setTimeout(function () { document.getElementById("background").innerHTML = message[i].text; if (i++ < b-1) { theLoop(i); } else { i = a; //theLoop(i); } }, delayValue); })(a, b); } var l = message.length; insertText(0, l);
<div id="background"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.