gpt4 book ai didi

javascript - For 循环和 getElementById

转载 作者:行者123 更新时间:2023-11-28 11:16:05 25 4
gpt4 key购买 nike

希望这是一个简单的方法,但我在从 for 循环打印数字系列并返回到 HTML 时遇到问题。请参阅下面的代码,当我点击按钮时,它只返回 10,但不返回其余数字 - 我哪里出错了?

<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">Try It</button>
<p id="number"></p>
<script>
function myFunction() {
for (i=0; i<11; i++) {
document.getElementById("number").innerHTML=i+"</br>";
}
}
</script>
</body>
</html>

最佳答案

在每个循环中替换元素的内容。如果您想添加内容,请使用 +=而不是= (作为最小的改变):

document.getElementById("number").innerHTML+=i+"</br>";
// here -----------------------------------^

也就是说,我不会这样做,因为它会让浏览器在幕后做很多不必要的工作。 每次您读取 innerHTML 的值,浏览器必须旋转该元素并构建一个表示其内容的字符串; 每次您写信给innerHTML ,它必须解析 HTML,清除以前的元素,并构建新的元素。

相反,请考虑构建一个字符串并进行一个赋值:

function myFunction() {
var i, s = "";
for (i=0; i<11; i++) {
s += i + "<br>";
}
document.getElementById("number").innerHTML = s;
}
<小时/>

旁注 1:您的代码正在成为 The Horror of Implicit Globals 的牺牲品因为你没有声明 i 。我已经通过声明修复了上面的问题。

旁注2:</br>是无效标签。在 HTML 中,它是 <br> (或 <br/> ;结尾 /完全可选)。在 XHTML 中,它是 <br/> .

关于javascript - For 循环和 getElementById,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29919394/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com