我正在读一本书,对于切片方法,它给出了一个这样的例子:
$('*').slice(2,3);
所以对我来说,它看起来像是在说好的,首先选择页面上的所有元素,然后返回第三个元素。
但是后来这本书说注意这与$('*').get(2)
这让我感到困惑,感觉我到目前为止什么都没学到。是说后者
返回包装集中的第三个“元素”,但第一个返回包含该元素的包装集。
我不明白区别,包装集与元素不同?
我正在读一本书,对于切片方法,它给出了一个这样的例子:
$('*').slice(2,3);
所以对我来说,它看起来像是在说好的,首先选择页面上的所有元素,然后返回第三个元素。
但是后来这本书说注意这与$('*').get(2)
这让我感到困惑,感觉我到目前为止什么都没学到。是说后者
返回包装集中的第三个“元素”,但第一个返回包含该元素的包装集。
我不明白区别,包装集与元素不同?
是,有一点不同。
这是一个 DOM 元素:
var element = document.getElementById("foo");
此元素公开了由 DOM( MDN 参考)指定的那些属性和函数。例如,假设它是一个输入元素,您可以使用element.value
.
这是一个 jQuery 对象,也称为“包装集”:
var wrapped = $(element);
这个特殊的包装集只包含上面的一个元素。包装的集合公开了 jQuery 定义的属性和函数。例如,您可以使用wrapped.val()
.
让我们看看这本书的笔记讨论了什么。
第一个报价:
后者返回包装集中的第三个“元素”
这意味着 的返回值是.get()
被包装的元素之一;当你使用它时,jQuery 会给你一个它所包装的元素之一的引用。API 文档明确声明结果是一个 DOM 元素:
检索与 jQuery 对象匹配的 DOM 元素之一。
第二个报价:
但第一个返回一个包含元素的包装集
这意味着 的返回值.slice
本身就是一个包装集,它只包装了源包装集正在包装的一些元素。API文档描述说结果是一个包装了原始子集的包装集:
将匹配元素集减少为由一系列索引指定的子集。
好吧,正如“切片”函数所说,您可以检索一组(多个对象),而“获取”函数只有一个元素。
但重要的是“get”函数返回 DOM 的一个元素(它不是 jquery 对象,而 slice 函数返回一个 jquery 对象。
例如,如果您想更改背景颜色:
$("*").get(8).style.backgroundColor = "red";
$("*").slice(8,9).css("background-color", "red");
使用 slice 的第一个选项不仅会返回第三个元素,还会返回第二个元素之后的所有元素,当您传递 3 时,它只会返回第三个元素。
但是如果你传递$('*').slice(2,5);
它会返回第三个、第四个和第五$('*').get(2)
个元素,它只返回第二个元素,它不需要任何参数来设置谁是第一个作为切片开始的元素,因为它只返回一个元素。