jQuery slice() 方法

jQuery 中的 slice() 方法用于从匹配元素集中选择元素的子集。子集是匹配集的一部分。

此方法接受两个参数：“start”索引，即从 0 开始的起始索引；和“end”索引，即结束索引。这些参数用于选择一系列元素。

语法

以下是 jQuery slice() 方法的语法：

$(selector).slice(start,stop)

参数

此方法接受以下参数：

start: 开始选择元素的索引。索引号从 0 开始。
stop: 结束选择的索引。如果未提供此参数，则选择将持续到集合的末尾。索引号从 0 开始。

如果我们将负值提供给上述任何参数，它将从所选元素的末尾选择元素，而不是从开头。

示例 1

在下面的示例中，我们将正值传递给 slice() 方法的“start”参数：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li").slice(2).css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ul>
</body>
</html>

执行上述程序时，它将选择从索引值“2”开始的元素。

示例 2

在此示例中，我们将正值传递给 slice() 方法的“start”和“stop”参数：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li").slice(1, 4).css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ul>
</body>
</html>

执行上述程序后，它将选择两个给定正索引（1 和 4）之间的元素。

示例 3

在这里，我们将负值传递给 slice() 方法的“start”参数：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li").slice(-3).css("background-color", "green");
        });
    </script>
</head>
<body>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ul>
</body>
</html>

执行后，它将从给定的负索引开始选择元素，从结尾开始计数。

示例 4

在这里，我们将负值传递给 slice() 方法的“start”和“stop”参数：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li").slice(-4, -1).css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ul>
</body>
</html>

执行上述程序后，slice() 方法将选择两个给定负索引之间的元素，从结尾开始计数。

jquery_ref_traversing.htm

打印页面