html - 为什么 Internet Explorer 不对“无效”元素应用 CSS？

Question

这适用于铬（我假设所有其他主要浏览器）

-html-

<invalid></invalid>

-css-

invalid {
    color: red;
}

<invalid>表示无效元素（不是 html 标准的一部分）

这是一个例子：http: //jsfiddle.net/myhonor/4H7Hj/

但是当我在 IE 中尝试这个时，它不起作用。

为什么会这样，有没有办法解决这个问题（这是 DTD 的事情吗？）

Answer 1

版本 9 之前的 IE 不会自动创建与它在标记中无法识别的任何标签相对应的 DOM 元素。这是 HTML5 元素在较旧的 IE 中无法工作的主要原因，需要包含 HTML5 shiv 才能工作。

在这种情况下，您甚至没有编写 HTML5；您正在编写自己的标记语言，它与 HTML 完全无关。解决此问题的最简单方法是实际编写 HTML……或者，如果您坚持制作自己的标签，则必须像 minitech 演示的那样手动创建它们，但希望完全自行连接它们。¹

---

¹ _{浏览器无法识别为 HTML 一部分的元素通常被创建为HTMLUnknownElementDOM 中的对象（包括 IE9 和更高版本），据说这样做是为了向前兼容（参见 HTML5）。这些对象具有 的基本属性HTMLElement，但除此之外没有什么可做的了……}

Answer 2

这就是 Internet Explorer 的工作方式，直到并包括版本 8。要修复它，只需document.createElement使用无效元素的名称调用：

document.createElement('invalid');

这是您更新的 jsFiddle。这与您看到的所有 HTML5 刀的想法相同。而且，正如其他人已经建议的那样，编写有效的 HTML 通常是最好的解决方案 :)