让 Selectivizr 工作的麻烦答案

【问题标题】：Troubles getting Selectivizr to Work让 Selectivizr 工作的麻烦
【发布时间】：2011-08-15 23:13:39
【问题描述】：

即使使用非常简单的页面，我也无法让 Selectivizr 正常工作。我做错了什么？

http://jiewmeng.kodingen.com/playground/selectivr.html

<html>
<head>
    <link rel="stylesheet" href="selectivr.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.1/mootools-yui-compressed.js"></script>
    <!--[if (gte IE 6)&(lte IE 8)]>
      <script src="selectivizr.js"></script>
    <![endif]--> 

</head>

<body>
    <h1>Hello World</h1>
    <p>Paragraph 1</p>

    <p>Paragraph 2</p>
    <p>Paragraph 3</p>
    <p>Paragraph 4</p>
    <p>Paragraph 5</p>
    <p>Paragraph 6</p>
</body>
</html>

CSS

p:nth-child(2n+2) { color: red }

【问题讨论】：

标签： internet-explorer css css-selectors selectivizr

【解决方案1】：

Selectivizr 仅在您的页面处于严格模式时才有效。因为你没有给你的页面一个doctype declaration，所以它在 Quirks 模式下加载，这意味着 Selectivizr 没有加载。

只需在打开html 标签之前添加<!DOCTYPE html>，Selectivizr 就会起作用。

【讨论】：

我在 IE8 中遇到了与 nth-child 相同的问题。上面的修复对我来说不适用于 nth-child，但添加 NWMatcher 1.2.5 有效。我们已经在使用 jQuery 和 Mootools。
嗨，Vik，NWMatcher 到底是做什么的，它对您有什么帮助？

【解决方案2】：

您可能希望将链接添加到 selectivizr 将作用的现有 css。

这是您应该在您的案例中放在头上的完整代码：

    <!--[if (gte IE 6)&(lte IE 8)]>
      <script type="text/javascript" src="/js/selectivizr/selectivizr.js"></script>
      <noscript><link rel="stylesheet" href="selectivr.css" /></noscript>
    <![endif]-->

还有 2 个其他已知问题：

在本地工作，它不会工作
同时使用 PIE.htc，如果您取消注释的话。

希望对您有所帮助！祝你好运。

【讨论】：

嗨@Laura，你提到的关于在本地工作的观点......得到证实了吗？我有同样的 nth-child 问题，但在 localhost 上工作。您是否建议将其托管在适当的域（尽管是本地域）上，它会起作用？