IE8 中的 CSS3 选择器？答案

【问题标题】：CSS3 Selectors in IE8?IE8 中的 CSS3 选择器？
【发布时间】：2012-09-28 06:34:53
【问题描述】：

好的，所以我最近发现了这个名为“Selectivizr”的脚本，我真的很兴奋，但是我将它插入到我的项目中，按照它说的设置它，它没有工作。

所以，我正在寻找任何类型的 JavaScript 库/脚本，它允许我在 IE8 中使用 CSS3 选择器（尤其是 :checked）。

Selectivizr 似乎坏了，一年多没有更新了。其他人有运气吗？

有人知道其他允许在 IE8 中使用 CSS3 选择器的脚本吗？

不寻找 CSS3 样式，如边框半径、阴影等。只寻找选择器，如 :before、:after、:checked 等...

【问题讨论】：

【解决方案1】：

Dean Edward 的 IE9.js 相当可靠，尽管我听说在使用其他库时也会出现一些不兼容问题。自己从未体验过它们，但很长时间没有在野外经常使用图书馆。即插即用，如果它没有损坏，那么一切就绪。

【讨论】：

【解决方案2】：

使用 jQuery 代码，您可以使用这几行代码在您的所有复选框（或它的容器）上切换一个类，无论何时选中或取消选中。然后，您可以在所有浏览器中使用常规 CSS 代码。

$("input[type='checkbox']").click(function() {
    $(this).parent().toggleClass("checked", this.checked);
});

如果您动态创建复选框，那么您可以使用.on() 的动态形式来确保捕获它们。

我个人更愿意使用这样的几行代码的解决方案，而不是使用试图添加 CSS 样式文件功能的繁重库。如果您打算使用它，请确保在采用它之前了解幕后实际发生的事情。

如果您只想要一个自己的选择器库，Sizzle 选择器库适用于各种浏览器，包括一直到 IE6 的浏览器。它将适应主机浏览器的功能，使用尽可能多的内置功能，并在主机浏览器不支持显式功能时使用它自己的代码。

您可以只使用here 中的选择器库本身，或者它也是 jQuery 内部的选择器库。

使用起来非常简单。您只需执行以下操作：

var items = Sizzle(":checked");

你将拥有一个匹配选择器的 DOM 元素数组。

【讨论】：

问题是，你需要写 JS 而不是只写 CSS，这是 selectivizr 和 IEX.js 应该做的。就我个人而言，我在其中任何一个方面都没有取得什么成功，尤其是 IEX.js 臃肿和错误。还有:checked，当输入被选中或取消选中时，它需要实时更新。
@WesleyMurch - 是的，这是用于 javascript 代码的 - 这就是我认为 OP 所要求的 - 能够将 CSS3 选择器与 javascript 一起使用。如果他们想在旧版本的 IE 的 CSS 样式文件中使用 CSS3 选择器 - 祝你好运。这将很难实现。
所以你是说IEx.js 应该不受欢迎？我不反对写一些 jQuery，因为我只是在学习它，但是有什么建议吗？如果检查/收音机被选中，我只是想改变风格。我可以在 CSS3 中完成这一切，但没有 IE8。
@NickDugger：如果它对你有用，那么无论如何。它对我不起作用，我只是放弃了那些 CSS 选择器。实际上，我“收藏”了这个问题，希望能找到更好的解决方案，在接受 IMO 之前，您应该先确保答案对您有用。
@NickDugger - 选中或取消选中复选框时，只需几行 jQuery 即可将类添加/删除到复选框。尝试使 CSS3 选择器在不支持它们的浏览器中的 CSS 样式文件中工作需要大量的 hack 行。我知道我宁愿把哪个放在我的代码中。