13

我见过很多例子（包括最喜欢的 Twitter 的引导程序），其中各种 API 使用$("[data-something]")而不是按类选择$(".something")

尽管如此，我还是试图找到有关这两个不同选择器之间性能的信息。我很惊讶许多性能测试确实发现这些选择器在大多数现代浏览器上都同样快，所以我决定自己做测试

我现在真的很困惑，我不知道是我的测试做错了（不知何故？）还是我之前检查过的其他测试？

如果我在测试时做错了什么或者这些测试是否正确并且数据属性选择器实际上比常规类选择器慢得多，有人可以提供更多信息吗？

谢谢

4

1 回答 1

6

使用属性选择器时，性能可能会因浏览器中的 querySelector 支持而异。jQuery 将退回到一个慢得多的内置库（称为 SizzleJS）。

类名的选择会更快，因为它总是使用 getElementsByClassName，这在所有常见的浏览器上都普遍支持。

在我看来，类的用途与数据属性不同。类将“分类”元素，以便它们可以正确设置样式并创建结构。

数据属性正是：数据。有时您需要在元素中存储其他数据。例如：

<table>
    <tr data-id="4" data-category="1">
        <td>Name</td>
        <td>Email</td>
    </tr>
</table>

请注意，出于同样的原因，我没有使用常规的“id”属性。

于 2013-07-23T21:47:38.440 回答