jQuery slice() metódus.
slice() Kiválaszt egy részhalmazt, az elemek index értéke alapján, melyet a zárójelek között, határozunk meg. Egy indexértéket határozunk meg, visszaadja a kiválasztottat, és azt követő összes testvérelemet. slice(2) Kettő indexérténél, a kiválasztott, és azt követő összes testvérelem, a másodiknak megadott indexértékig. slice(1, 4) Ezt a módszert alkalmazzuk, amikor a kiválasztott elemcsoportból, kezdő és végpont meghatározással választjuk ki, az elemeket.
|
<div id="div01">
<p>Első p elem. (index 0).</p> <p>Második p elem. (index 1).</p> <p>Harmadik p elem. (index 2).</p> <p>Negyedik p elem. (index 3).</p> <p>Ötödik p elem. (index 4).</p> <p>Hatodik p elem. (index 5).</p> <div id="div02">
</div><p>Ez p elem. (globális indexe 6). ------ Ebben a divben (index 0)</p> <p>Ez p elem. (globális indexe 7). ------ Ebben a divben (index 1)</p> <p>Ez p elem. (globális indexe 8). ------ Ebben a divben (index 2)</p> <p>Ez p elem. (globális indexe 9). ------ Ebben a divben (index 3)</p> </div><p>Ez p elem. (index 10).</p> |
Teszteléshez, a sárga háttérszínnel kiemelt területre írjuk be, a fenti button gombokon látható, meghatározásokat.
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#Teszt").click(function(){
$("p").slice(2).css( {"color": "black", "border": "2px solid red", "background-color": "orange"} );
});
});
</script>
</head>
<body>
<div id="div01">
<p>Első p elem. (index 0).</p>
<p>Második p elem. (index 1).</p>
<p>Harmadik p elem. (index 2).</p>
<p>Negyedik p elem. (index 3).</p>
<p>Ötödik p elem. (index 4).</p>
<p>Hatodik p elem. (index 5).</p>
<div id="div02">
<p>Ez p elem. (globális indexe 6). ------ Ebben a divben (index 0)</p>
<p>Ez p elem. (globális indexe 7). ------ Ebben a divben (index 1)</p>
<p>Ez p elem. (globális indexe 8). ------ Ebben a divben (index 2)</p>
<p>Ez p elem. (globális indexe 9). ------ Ebben a divben (index 3)</p>
</div>
</div>
<p>Ez p elem. (index 10).</p>
<button id="Teszt">Teszt<br /> button gomb.</button>
</body>