jQuery中slice()
时间:2020-02-23 14:45:59 来源:igfitidea点击:
前面我们看过如何在jQuery中获取具有特定索引的元素,但有时我们想要获取元素索引数组的子集。
我们可以使用slice()方法。
jQuery slice()
slice()方法将匹配的元素集减少为由一系列索引指定的子集。
此方法接受两个整数值,开始索引和结束索引。
此方法将返回开始索引和结束索引之间的元素。
元素子集包括开始索引处的元素,但不包括结束索引处的元素。
这是使用jQuery slice()的一般语法
- selector.slice(开始,结束)
start:这是一个强制性参数,用于指定开始选择元素的起始索引。
索引编号从0开始。
使用负数表示从匹配的元素集的末尾偏移。
end:这是一个可选参数,用于指定停止选择元素的结束索引。
如果我们省略结束索引,选择范围将一直持续到匹配集的结束。
jQuery slice()示例
以下示例演示了jQuery slice()的用法。
<!doctype html>
<html>
<head>
<title>jQuery Traversing slice</title>
<style>
.highlight{
background: yellow;
}
.highlight1{
background: green;
}
div{
display: block;
border: 3px solid black;
color: black;
padding: 5px;
margin: 25px;
width:250px;
}
</style>
<script src="https://code.jquery.com/jquery-2.1.1.js"></script>
</head>
<body>
<h2>jQuery slice() demo</h2>
<div>My index is 0, also -6 from last</div>
<div>My index is 1, also -5 from last</div>
<div>My index is 2, also -4 from last</div>
<div>My index is 3, also -3 from last</div>
<div>My index is 4, also -2 from last</div>
<div>My index is 5, also -1 from last</div>
<script>
$( "div" ).slice( 0,2).addClass("highlight1");
$( "div" ).slice( -3,-1 ).addClass("highlight");
</script>
</body>
</html>
在此示例中,我们对开始和结束参数使用了正索引和负索引。
$(" div").slice(0,2).addClass(" highlight1");":这将在开始索引0和结束索引2之间选择div元素,并将颜色更改为绿色。
该行中使用的slice()方法与slice(-6,-4);相同。
$(" div").slice(-3,-1).addClass(" highlight");"这将在开始索引-3和结束索引-1之间选择div元素,并将颜色更改为黄色。
该行中使用的slice()方法与slice(3,5);相同。
当您想从匹配集中获取元素的子集时,jQuery slice()方法非常有用。

