条带化表格：Chrome/Safari 中 tr:nth-child td 的错误

Question

我正在尝试根据行在表格中的位置和值，使用 JavaScript 对表格单元格进行条带化，因此我想使用 tr:nth-child(i) td 仅抓取单元格（忽略 th）...

这是一个显示问题的小提琴（错误？）我发现：http://jsfiddle.net/redroot/pBe94/。正如您可能看到的那样，我正在删除表格正文前四行中的td 元素。在 Chrome 和 Safari 中，在第 2 行和第 3 行中只能找到第一个单元格，而如果我先找到该行，然后使用 find("td") 就可以正常工作，如第 4 行所示。

起初我以为这是我的标记，但它看起来不错，并且在 Firefox 中运行良好。所以我有点难过，任何帮助将不胜感激！

（在我的测试中，document.querySelectorAll 会发生一些事情，仅在 Chrome 和 Safari 中。）

Answer 1

是的，似乎确实存在一些 WebKit 错误。我之前here也遇到过这个问题，但是这个bug显然还没有修复。

要做的一件事是强制 Sizzle 进行选择，而不是使用原生 WebKit 引擎：

$.expr[":"].dummy = function() {
    return true;
};

那么你可以使用：

$("#rows tbody tr:nth-child(1) td:dummy").css("background-color","#e0e0e0");

由于:dummy 本身不可用，jQuery 将使用 Sizzle（它的自定义选择库）。不过，采用这种非本地方式会降低性能（一如既往）。

http://jsfiddle.net/pBe94/2/