javascript - 通过 .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:

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()我们会为您解决这个问题。

<小时/>

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

此外，您似乎正在使用属性选择器按 ID 选择元素。这是一种愚蠢的选择元素的方法，因为有一种更简单的方法 - 并且可能快得多 - ID selector 。这是交换:

$('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