例項
選中所有段落,然後將所選內容縮減為只包含第一和第二個段落:
$("p").slice(0, 2)
.wrapInner("");
定義和用法
slice() 把匹配元素集合縮減為指定的指數範圍的子集。
語法
.slice(selector,end)
引數 | 描述 |
---|---|
selector |
基於 0 的整數值,指示開始選取元素的位置。 如果是負數,則指示從集合末端開始的偏移量。 |
end |
基於 0 的整數值,指示結束選取元素的位置。 如果是負數,則指示從集合末端開始的偏移量。 如果省略,則選取範圍會在集合末端結束。 |
詳細說明
如果給定一個表示 DOM 元素集合的 jQuery 物件,.slice() 方法用匹配元素的子集構造一個新的 jQuery 物件。已應用的 index 引數集合中其中一個元素的位置;如果省略 end 引數,則 index 之後的所有的所有元素都會包含在結果中。
請思考這個帶有簡單列表的頁面:
<ul> <li>list item 1</li> <li>list item 2</li> <li>list item 3</li> <li>list item 4</li> <li>list item 5</li> </ul>
我們可以向列表項集合應用該方法:
$(`li`).slice(2)
.css(`background-color`, `red`);
此次呼叫的結果是專案 3、4 和 5 的背景被設定為紅色。請注意,已應用的 index 引數基於零,引用的是 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) 的之間的範圍中的唯一專案。