这个 += 在 javascript 中是如何工作的？

Question

我正在学习 javascript 中的循环，但在很多示例中我看到了 + =，我知道它的意思是 a+= b ( a= a+b ) 但我不知道这里的确切含义这段代码，

var i;
for (i = 0; i < 10; i++) {
  document.getElementById("demo").innerHTML += i + "<br>";
}

<p id="demo"></p>

Answer 1

这段代码会循环10次

向元素演示添加（i + 换行符），即在段落内

每次循环执行

Answer 2

您在问题中给出了答案。

如果

a += b

与

相同

a = a + b

然后

document.getElementById("demo").innerHTML += i + "<br>";

与

相同

document.getElementById("demo").innerHTML =
    document.getElementById("demo").innerHTML + i + "<br>";

换句话说，i 的值作为字符串（循环计数器变量）和  （HTML 换行符）被添加到每个循环中。

Answer 3

正如您所说，a += b 等同于 a = a + b（存在一些细微差别，但我们暂时忽略它们）。

当其中一个操作数是字符串时，+ 导致连接。所以 "ABC" + "DEF" 变成 "ABCDEF"。如果只有一个操作数是字符串，则先将另一个变成字符串。

innerHTML 获取或设置元素的 HTML 内容，因此 innerHTML += i 将 i 转换为字符串，然后将其添加到 HTML元素的内容。

Answer 4

很简单。

document.getElementById("demo").innerHTML += i + "<br>";

意味着每次循环执行时 i 的值将与 p 中的先前值一起附加到 p 或只是为了使其更清楚 document.getElementById("demo").innerHTML += i + " " 等同于 document.getElementById("demo").innerHTML = document.getElementById("demo").innerHTML + i + " ";.

var i;
for (i = 0; i < 10; i++) {
  document.getElementById("demo").innerHTML = document.getElementById("demo").innerHTML + i + "<br>";
}

<p id="demo"></p>

如果你不这样做 += 你只会得到最后一个值

var i;
for (i = 0; i < 10; i++) {
  document.getElementById("demo").innerHTML = i + "<br>";
}

<p id="demo"></p>

Answer 5

在你的 for 循环中你得到元素的 innerHTML 并从循环中添加 i 和 "border" ( )，所以你不需要为了不完全覆盖它，您添加了 i 和  ，结果，您可以看到一个从 0 到 9 的数字列表，每个数字都从新行开始。

document.getElementById("demo").innerHTML += i + " ";的意思是取已有的innerHTML，添加i再添加 ，最后赋值给元素的innerHTML——很简单。

Answer 6

代码正在写出 id = "demo" 的元素的内部 html。循环迭代10次；

html 在每次迭代中看起来像这样：

第一次迭代（追加 0 ）

<p id="demo">
0<br>
<p>

第二次迭代（追加 1 ）

<p id="demo">
0<br>
1<br>
<p>

等等...

第 10 次迭代（追加 9 ）

<p id="demo">
0<br>
1<br>
2<br>
3<br>
4<br>
5<br>
6<br>
7<br>
8<br>
9<br>
<p>

所以这段代码中的 += 基本上是附加到内部 html，即保持先前编写的文本完整并附加 i 。

这个 += 在 javascript 中是如何工作的？

How this += works here in javascript?

javascript

oop

operators