javascript 定义一个变量来输出innerHTML
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5422652/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
defining a variable to output innerHTML
提问by Audrey
I've included the HTML code to give the whole picture of what I am trying to understand.
我已经包含了 HTML 代码，以提供我试图理解的全貌。
<html>
<head>
<title>Echo App</title>
</head>
<body>
<p>Echo</p>
<p>Say what? <input id="sayThis" size="40" /></p>
<p>How many times?
<select id="howMany">
<option value="1">1</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
</select></p>
<p><button onClick="doLoop()">Do it!</button></p>
<p><div id="results"></div></p>
<script type="text/javascript" language="javascript">
function doLoop() {
var sayWhat = document.getElementById("sayThis").value;
var maxLoop = document.getElementById("howMany").value;
var str = ""; // where we'll store our output temporarily
for (var i=1; (i<=maxLoop); i++) {
str = str + i + ":" + " " + sayWhat + '<br>';
}
document.getElementById("results").innerHTML=str;
}
</script>
</body>
</html>
How would the code be written out for this use of 'str'
将如何写出用于“str”的这种使用的代码
str = str + i + ":" + " " + sayWhat + '<br>';
And, more especially, how would the code be written out for this use of 'str'
而且，更特别的是，如何为这种“str”的使用写出代码
document.getElementById("results").innerHTML=str;
I look forward to your replies/answers. Thank you.
我期待着您的回复/回答。谢谢你。
回答by Naftali aka Neal
your code works fine, look at it here :-)
您的代码工作正常，请在此处查看:-)
http://jsfiddle.net/maniator/s8fyQ/
http://jsfiddle.net/maniator/s8fyQ/
The reasonwhy it works:
This is because stris first set as an empty string, ad as you go through the loop you add on more text.document.getElementById("results").innerHTML=str;sets the html of the element with the id=resultsto whatever is inside of the strvariable that you set earlier
它起作用的原因：
这是因为str它首先设置为空字符串，当您通过循环添加更多文本时，广告。document.getElementById("results").innerHTML=str;将元素的 html 设置为您之前设置id=results的str变量内的任何内容
UPDATE
更新
Instead of using stryou can do:
str您可以执行以下操作，而不是使用：
for (var i=1; (i<=maxLoop); i++) {
document.getElementById("results").innerHTML =
document.getElementById("results").innerHTML + i
+ ":" + " " + sayWhat + '<br>';
}
回答by Mike Thomsen
If you're trying to understand why it works, it's simple.
如果您想了解它的工作原理，这很简单。
Your code creates a new variable, adds new text to that variable in each iteration of the loop and then sets the value of innerHTML. When you set the value of innerHTML, the browser triggers a behavior which causes it to dynamically update the tag you told it (results).
您的代码创建一个新变量，在循环的每次迭代中向该变量添加新文本，然后设置innerHTML 的值。当您设置 innerHTML 的值时，浏览器会触发一个行为，使其动态更新您告诉它的标签（结果）。
