使用jQuery集合

Question

我想增加我对jQuery的理解。请考虑下面的代码。

if ($('.myClass').data('id') == '123') { 
} 

这是如何工作的？它看起来很简单，直到你明白$()返回一组元素。那么上面的代码究竟做了什么？如何比较这样的元素的集合的data-id属性值？

（我知道我可以使用each()集合中明确测试的每个元素我的问题是关于什么上面的代码一样。）

Answer 1

.data('id')返回集合中的第一个项目的价值，但.data('id','xyz')将设定值集合中的所有项目 - 许多相同的行为，其它的jQuery方法，如.html()，.text()等

它可能似乎没有什么意义，只是在类似的if声明中测试第一个，但对于知道只有一个元素的情况，例如当您的选择器是id时，或者在内部使用$(this).data('id')时更有意义事件处理程序或其他。

如果你问如何测试集合中的所有项目是否有一个特定的数据值，你可以这样做：

var $col = $('.myClass'); 
if ($col.length === $col.filter(function(){return $(this).data('id') === '123';}).length) { 
    // do something 
} 

或者，如果你只是想知道，如果至少一个具有数据值：

if ($('.myClass').filter(function(){return $(this).data('id') === '123';}).length > 0) { 
    // do something 
} 

Answer 2

您可以使用jQuery。每（） - http://api.jquery.com/jQuery.each/

例在注释中，因为stackoverflow不喜欢jsFiddle那么多。

Answer 3

我相信如果你试图通过jquery函数获取值，它将返回集合中第一个项目的值。例如，如果您有：

<div class='1'></div> 
<div class='2'></div> 
<div class='3'></div> 

并运行：

$('div').attr('class'); 

它将返回 “1”。我不知道这是否通过所有jQuery函数是统一的，但这是预期的行为。