为H1元素赋予随机颜色

Question

您能解释一下这段代码有什么问题吗？

var a = document.getElementById("id1").style.color;

a = "blue"应该将id1的元素的文本颜色设置为blue

function randomColor() {
   var cArr = '1234567890ABCDEF'.split('');
   var c = "#";
   for (var i = 0; i < 6; i++) {
       c += cArr[Math.floor(Math.random() * 16)]
   }
   a = c;
   return c;
}
randomColor();

对我来说看起来不错，但是可以肯定的是，这并不是因为它没有用。 您能解释一下我在做什么错吗？

Answer 1

您正在将a设置为原始值。 因此，您无法分配颜色。

 function randomColor() { var c = "#"; for (var i = 0; i < 6; i++) { c += (Math.random() * 16 | 0).toString(16); } return c; } var a = document.getElementById("id1").style; a.color = randomColor(); 

 <h1 id="id1">stackoverflow</h1> 

Answer 2

a =“ blue”应该将id1的元素的文本颜色设置为blue

不，不正确的a包含元素id1的当前颜色。

要设置颜色，您可以将元素存储在变量中，然后将其设置为blue ，如下所示：

var a = document.getElementById("id1");
a.style.color = "blue";

希望这可以帮助。

---

片段

 function randomColor() { var cArr = '1234567890ABCDEF'.split(''); var c = "#"; for (var i = 0; i < 6; i++) { c += cArr[Math.floor(Math.random() * 16)] } return c; } var a = document.getElementById("id1"); a.style.color = randomColor(); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h1 id="id1">H1 element</h1> 

Answer 3

要回答这个问题，您需要了解如何传递数据并将其存储在变量中。 您似乎知道对象是通过引用传递的，如果将一个对象存储在多个不同的变量中，则可以修改一个，并且所有变量都将不同。

但是，当您将对象的属性存储在变量中并且该属性具有简单的数据类型（例如数字，字符串或布尔值）时，该变量仅存储值而不是引用。 您要做的是将document.getElementById调用中的结果元素存储在el变量中，然后在函数中访问其style.color。

el.style.color = 'blue'