使用JavaScript更改背景颜色

Question

我需要使用Javascript更改我的一个主要容器div的背景。 最终目标是应用渐变，但是我在更改背景颜色时遇到了问题。 这是代码：

var main = document.getElementById("main");
  main.parentNode.style.maxWidth = 0;
  main.parentNode.style.maxHeight = 0;
  main.parentNode.style.margin = "0px";
  main.style.backgroundColor = "black";

页面加载并执行JS后，标签在浏览器中的外观即是如此。

<div id="main" style="z-index: 10; position: relative; top: 0px; left: 0px; background-color: black;">

我没有收到任何JS错误。 JS正在执行其他代码，并且代码中的背景色已更改但未呈现。 我最关心的浏览器是Safari，但在Chrome中却得到了相同的效果。 任何帮助将非常感激。

编辑：这是一个小提琴： http : //jsfiddle.net/hz7AR/

Answer 1

您将父容器设置为maxWidth 0和maxHeight0。我认为这是有问题的

Answer 2

您需要设置div的宽度和高度。 目前div没有宽度或高度将您的html更改为：

<div id="main" style="z-index: 10; position: relative; top: 0px; left: 0px; background-color: black; height: 100px; width: 100px">

该代码使div为100 x 100像素，您可以将其设置为任意值