JQuery .slice()用法及代码示例

2023-03-28 05:42| 来源: 网络整理| 查看: 265

给定一个表示一组 DOM 元素的 jQuery 对象，.slice() 方法构造一个新的 jQuery 对象，其中包含由 start 和可选的 end 参数指定的元素的子集。提供的start 索引标识集合中元素之一的位置；如果省略end，则该元素之后的所有元素都将包含在结果中。

考虑一个带有简单列表的页面：

list item 1 list item 2 list item 3 list item 4 list item 5

我们可以将此方法应用于列表项集：

$( "li" ).slice( 2 ).css( "background-color", "red" );

此调用的结果是项目 3、4 和 5 的红色背景。请注意，提供的索引是从零开始的，并且是指元素在 jQuery 对象中的位置，而不是在 DOM 树中。

end 参数允许我们进一步限制所选范围。例如：

$( "li" ).slice( 2, 4 ).css( "background-color", "red" );

现在只选择了项目 3 和 4。该 index 再次从零开始；范围扩展到但不包括指定的索引。

负 index

jQuery .slice() 方法是在 JavaScript .slice() 数组方法之后设计的。它模仿的函数之一是能够将负数作为start 或end 参数传递。如果提供了负数，则表示从集合末尾开始的位置，而不是开头。例如：

$( "li" ).slice( -2, -1 ).css( "background-color", "red" );

这次只有列表项 4 变为红色，因为它是距离末尾两个 (-2) 和末尾一个 (-1) 之间的唯一项。

【本文地址】

今日新闻