jQuery 1.4.4：如何根据数据属性值查找元素？

我想这应该是一个非常简单的任务，但使用Firefox for Mac，3.6.12以下不起作用：

// assign data attributes $('.gallery li').each(function(i) { $(this).data('slide',i+1); }); // outputting an empty jQuery object console.log($('.gallery li[data-slide]')); // this does not work either outputting an empty jQuery object console.log($("[data-slide]")); 

使用Firebug我可以看到所有数据幻灯片属性（包括它们的数值）都正确附加到li并注销：

 $('.gallery li').each(function(index) { console.log($(this).data()); }); 

按预期输出：

 Object { slide=1} Object { slide=2} Object { slide=3} Object { slide=4} 

那么为什么第一个console.log不起作用？

Answer 1

data将项添加到jQuery的内部数据持有者，而不是data-属性。 这些被读入 jQuery的data()结构，但是使用jQuery插入的值不会被反馈到DOM中。

模仿这个的最简单方法是使用.filter() ：

 // To replicate $('.gallery li[data-slide]') $('.gallery li').filter(function(){ return (undefined !== $(this).data('slide')); }); 

---

您也可以将其作为自定义选择器执行此操作：

 $.expr[':'].hasData = function(obj, index, meta, stack) { return (undefined !== $(obj).data(meta[3])); }; $('.gallery li:hasData(slide)'); // li elements under .gallery with "slide" data set $(':hasData(slide)'); // any element with "slide" data set