5

假设我有这段 HTML：

<div id="container">
   <ul>
       <li><a href="#" data-some-info="foo">Bar</a>
       <!-- repeating a few like the one -->                          -->
       <!-- above for a while ...        -->
   </uL>
</div>

我想在some-info定义数据时对所有带有数据的锚元素应用一些东西。

我只是想了解为什么这种行为（它是一个错误吗？）

$("#container").find("a:data(some-info)").size();  // -> 0
$("#container").find("a").data("some-info");       // -> "foo"
$("#container").find("a:data(some-info)").size();  // -> 1 (actual expected val)

有任何想法吗？

更多信息：我正在使用 jQuery 1.9.0 和 jQuery UI 1.9.2

**编辑**

我知道$("#container").find("a[data-some-info]")。_ 这不是我在这里提出的问题。如果有一个数据选择器，为什么它会这样？

4

3 回答 3

3

这是选择器的实现方式：

$.extend( $.expr[ ":" ], {
    data: $.expr.createPseudo ?
        $.expr.createPseudo(function( dataName ) {
            return function( elem ) {
                return !!$.data( elem, dataName );
            };
        }) :
        // support: jQuery <1.8
        function( elem, i, match ) {
            return !!$.data( elem, match[ 3 ] );
        },

（参考https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.core.js#L160）

注意它是如何使用$.data而不是$(elem).data. 这意味着它只查找通过$.dataor$().data方法存储在元素上的数据。它不会在元素上查找数据属性，我认为它不是为此目的。属性等于选择器是您应该使用的。[data-foo]但是请注意，它会查看属性，如果您使用 jQuery 将数据添加到元素，$().data如果 jQuery 不更新属性，它可能与该选择器不匹配。

于 2013-01-30T19:22:24.560 回答
1

:data 选择器不是 JQuery 核心的一部分。这可能是一个错误，但 JQuery 文档说 HTML5 数据属性被拉入内部 JQuery 数据对象（大概在调用.data）而不是作为:data伪选择器的一部分（根据 JQuery UI 文档查询内部数据表示原样，并没有说明 HTML5 数据属性）

替代方法：

$("#container").find("a[data-some-info='foo']")如果在数据属性上设置了任何内容，请使用或.find("a[data-some-info]")。

于 2013-01-30T19:10:08.563 回答
1

从文档，

表达式$( "div:data(foo)")匹配 a<div>如果它有数据存储通过.data( "foo", value )

并来自 jquery 代码->

jQuerydata()存储在对象内部数据缓存内的单独对象中，以避免内部数据和用户定义数据之间的键冲突（来自 jQuery 代码的注释）

https://github.com/jquery/jquery/blob/master/src/data.js#L51

https://github.com/jquery/jquery/blob/master/src/data.js#L63

当它在 HTML 中定义时，它只是一个用户定义的数据元素，不会被 jQuery:data选择器选择。

但是，当您调用时.data(some-info)，它实际上会读取用户定义的数据并将其复制到内部数据中，然后使用:data拾取元素，因为它可以在内部数据中找到它。

这不是错误，因为文档中明确提到了这一点。

您应该使用.lengthwhich 是一个属性来从选择器中获取返回元素的数量。

自jQuery 1.8起也.size已弃用。http://api.jquery.com/size/

于 2013-01-30T19:07:49.090 回答