css - IE 7/怪癖模式和背景颜色？

Question

这将是一个模糊不清的问题，这可能是因为即使使用 IE Web Developer，我也不知道发生了什么。

我有一个正在开发的实用程序。它主要是 JavaScript，并且有一个显示在页面上的小型 float DIV 用户界面。到目前为止，标准的东西。问题是 UI 中某些 DIV 的背景颜色。颜色由 CSS 分配，并且(厌倦的重复:)它在 Firefox、Chrome 和 Opera 中看起来不错，但当然 IE 很难。

在 quirks 模式或 IE7 模式下，背景不会在 IE 中显示，但在 IE8 模式下会显示。对于我的生活，我似乎无法弄清楚为什么 IE7 不显示背景。

您可以看到违规代码的页面在这里:Log Hound Demo . float DIV 位于右上角 - 单击“V”将其打开。

在 IE 中查看该页面，然后在 [地球上任何其他浏览器] 中查看，将很容易地向您显示缺少的背景颜色。我发誓，即使是 Lynx 也能更好地渲染它……咳咳。有问题的 DIV ID 是 lhPlateHead、lhPlateCtrlPanel、lhPlateTagPanel——至少使用 Firebug 很容易找到。他们应该注意背景颜色为 #DFEAF8 的 .lhPlateColor 类，但从未应用该颜色。

随着 IE web developer 的启动，我尝试删除 CSS 类并重新添加它们。我尝试了浏览器和文档模式的每一种组合 - 同样，只有 IE8 文档模式下的 IE8 浏览器模式的背景颜色有效。

如果有人无聊到可以看一看并想出点什么，我将非常感激。

Answer 1

嗯 - 我终于弄明白了，就我而言，这是 IE 总是很糟糕的另一个原因。

问题的情况是:

1. 您正在以编程方式创建一个元素:
   myelmt = document.createElement('DIV')
2. 您正在以编程方式设置该元素的样式:
   myelmt.setAttribute('class', 'myclass');
3. 然后您将以编程方式将该元素添加到 DOM:
   body.appendChild(myelmt);
4. 您正在使用 IE。
5. IE 讨厌你。

在这种情况下，IE8 将遵循“myclass”css 并在将元素添加到 DOM 时正确设置元素样式。 IE7 和我猜下面的 CSS 样式会被取消，让你认为在麦当劳工作的压力可能要小得多。

为不耐烦的人回顾一下:

适用于 IE8 和地球上的所有其他浏览器

var myelmt= document.createElement('DIV');
myelmt.setAttribute('class', 'myclass');
body.appendChild(myelmt);

适用于 IE7 及以下版本:

var myelmt= document.createElement('DIV');
var attr = document.createAttribute('class');
attr.value = 'myclass';
myelmt.setAttributeNode(attr);
body.appendChild(myelmt);

如果有人能准确地解释为什么这对 IE7 来说是一个问题，请随意，因为我 Revel 于细节。否则，请记住，在有人丢失对象引用之前，一切都是有趣的游戏。