通过.each()的Jquery/Javascript div选择给出HTMLDivElement对象而不是Object对象.隐藏div对象的解决方法是什么？

Question

我有5个div带属性的元素data-role="content"

我选择所有这些

a = $('div[data-role=content]')

它回来了[object HTMLDivElement].

为了隐藏所有div元素,我迭代a并隐藏每个元素

<script>
$.each(a, function(index, value) {
    if (value) {
        alert(typeof(value));
        value.hide();
    }
})
</script>?

但它返回错误....

TypeError: Result of expression 'a.hide' [undefined] is not a function

另一方面,如果我选择一个id为div的div:

a = $('div[id=content1]')

它给了我一个:

 [object Object]

隐藏功能a.hide()适用于该情况.

问题是:"如何[object Object]一次选择所有元素？" 或者,"我怎样才能转换[object HTMLDivElement]成[object Object]？"

Answer 1

你真的只是在寻找这个:

var a = $('div[data-role=content]');
a.hide();

您不需要显式迭代jQuery对象中的每个元素,因为它.hide()会为您处理.

NB $.each()用于迭代任何类似数组的对象.但是,当您已经在使用jQuery对象时,请使用.each()而不是$.each().

此外,您似乎正在使用属性选择器按ID选择元素.这是选择元素一个愚蠢的办法,因为有一个更简单-可能多快- ID选择.这是交换:

$('div[id=content1]') // Change this
$('div#content1')     // to this

但是,您可以做得更好,因为元素ID必须是唯一的,这意味着指定ID 和标记名称是不必要的.所以,

$('div#content1') // Change this
$('#content1')    // to this

好的,所以我无法抗拒跟进整个ID选择器位来证明独奏ID选择器的速度有多快.在我的测试中:一个数量级. http://jsperf.com/jq-id-selectors