Jak*_*123 7 html javascript arrays loops for-loop
我希望每1.5秒更改span标记中的单词,但到目前为止它只显示数组'list'中的最后一个单词.
这是我的javascript
var list = [
"websites",
"user interfaces"
];
setInterval(function() {
for(var count = 0; count < list.length; count++) {
document.getElementById("word").innerHTML = list[count];
}}, 1500);
这是html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<span id="word"></span>
</body>
</html>
您不需要for循环，只需使用它setInterval，counter或者使用数组操作甚至更简单：
var list = [
"websites",
"user interfaces",
"cool neh?"
];
var count = 0; // Separate your count
function changeWord() { // Separate your concerns
document.getElementById("word").innerHTML = list[count];
count = ++count % list.length; // Increment and loop counter
}
changeWord(); // First run,
setInterval(changeWord, 1500); // Subsequent loops<span id="word"></span>如果您不想使用 acounter而是使用数组操作：
var list = [
"websites",
"user interfaces",
"cool neh?"
];
var ELWord = document.getElementById("word"); // Cache elements you use often
function changeWord() {
ELWord.innerHTML = list[0]; // Use always the first key.
list.push(list.shift()); // Push the first key to the end of list.
}
changeWord();
setInterval(changeWord, 1500);<span id="word"></span>PS：正如您在此处list.unshift(list.pop())看到的那样，将使用相反的方法。
从性能角度来看，使用的解决方案counter应该更快，但您有一个小数组，因此差异不应引起任何担忧。