jQuery ±éÀú - slice() ·½·¨
ʵÀý
Ñ¡ÖÐËùÓжÎÂ䣬Ȼºó½«ËùÑ¡ÄÚÈÝËõ¼õΪֻ°üº¬µÚÒ»ºÍµÚ¶þ¸ö¶ÎÂ䣺
$("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) µÄÖ®¼äµÄ·¶Î§ÖеÄΨһÏîÄ¿¡£