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和maxHeight 0.我认为存在问题

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像素，您可以将其设置为您喜欢的任何内容

使用JavaScript更改背景颜色

2 个答案: