为什么我不能分配element.innerHTML？

Question

为什么我不能将对some_var.innerHTML的引用存储到一个变量中，然后对其进行修改？

什么规则支配呢？

HTML

<div id = "out"> 
test 
</div> 

它的工作原理，如果我直接做到这一点。

var out = document.getElementById("out"); 
var res = out.innerHTML; 
res = "foo"; 

https://jsfiddle.net/yo1oajmf/

Answer 1

你;再将其分配给res，然后重新分配资源。此代码不会将任何内容分配给innerHTML。

out.innerHTML = "foo"; 

这就是你如何改变innerHTML。

Answer 2

您的代码正在工作。它只是将innerHTML存储在res中，然后覆盖下一行中的内容。此外，在将res的值指定为"foo"后，您不会执行任何操作。

你也必须明白，当你存储innerHTML，你stoing数据的副本。如果您想修改innerHTML， ，则必须回写它。

此示例读取第一div价值，然后将写入该加foo到第二个div。

var out = document.getElementById("out"); 
 
var res = out.innerHTML  // Store the HTML 
 
res = res + " foo";   // Adjust the data 
 
out.innerHTML = res;  // Write the new data back to the HTML element

<div id = "out">test</div>

Answer 3

因为分配给res是不一样分配给innerHTML;即使您之前将innerHTML指定为res。

当您说res = element.innerHTML时，您将innerHTML的内容分配到res。当你说res = "something else"时，你正在改变分配给res的东西。

说res = element.innerHTML不不意味着到res所做的任何更改将反映在innerHTML。

Answer 4

由于在下面的代码的innerHTML vaue即测试将被分配给变量res。

var out = document.getElementById("out").; 
    var res = out.innerHTML; 

此代码不过，

var res = document.getElementById("out").innerHTML; // res = "test" 

之后将要覆盖资源由“富”的值（即测试）。

Answer 5

如果你使用jQuery的你可以简单地做到以下几点：

$("#out").html("foo");