多个 HTML 背景颜色的 Javascript 变量答案

【问题标题】：Javascript Variables to Multiple HTML Background Colors多个 HTML 背景颜色的 Javascript 变量
【发布时间】：2010-11-08 00:36:49
【问题描述】：

并提前感谢您提供的任何和所有帮助。我在互联网上查了一下，没有发现其他人遇到我的具体问题。

我在一个网站上运行 Wordpress，并且有两个 div，我想让用户更改使用 Javascript/HTML 的颜色。背景颜色可以在 CSS 或 HTML 中指定。我是 Javascript 的新手，但我希望能够创建两个 Javascript 变量，例如：

var headercolor="3366FF";
var maincolor="FFFFFF";

然后在 HTML 中，例如，将背景颜色指定为变量。

<div id="header" style="background-color:javascript:document.write(headercolor);">
CONTENT HERE
</div>
<div id="main" style="background-color:javascript:document.write(maincolor);">
CONTENT HERE
</div>

由于 Javascript 变量被赋予默认值，它们会在第一次加载页面时显示这些值，但是当用户单击链接时，颜色会发生变化。

<a href="#" onclick=javascript:var maincolor="3366FF";>Click here to get a blue main background!</a>

基本上，我想知道这是否可能。如果是这样，我该怎么做？如果没有，感谢您花时间阅读这篇文章，请让我知道它无法完成，或者可以通过其他方式完成。

【问题讨论】：

标签： javascript html colors background

【解决方案1】：

如果有的话，不要在这种情况下使用 document.write()。

您实际上是在问是否可以将元素绑定到变量，而这在 Javascript 和 DOM 中是行不通的。您必须创建一个函数来执行此操作，或者使用函数文字，或者只是一个 Javascript 语句，如下所示（您不需要 javascript: 前缀）：

onclick="document.getElementById('main').style.backgroundColor='#3366FF'"

应该为你做。

【讨论】：