jQuery ±éÀú - next() ·½·¨
ʵÀý
²éÕÒÿ¸ö¶ÎÂäµÄÏÂÒ»¸öͬ°ûÔªËØ£¬½öÑ¡ÖÐÀàÃûΪ "selected" µÄ¶ÎÂ䣺
$("p").next(".selected")
.css("background", "yellow");
¶¨ÒåºÍÓ÷¨
next() »ñµÃÆ¥ÅäÔªËØ¼¯ºÏÖÐÿ¸öÔªËØ½ôÁÚµÄͬ°ûÔªËØ¡£Èç¹ûÌṩѡÔñÆ÷£¬ÔòÈ¡»ØÆ¥Åä¸ÃÑ¡ÔñÆ÷µÄÏÂÒ»¸öͬ°ûÔªËØ¡£
Óï·¨
.next(selector)
²ÎÊý | ÃèÊö |
---|---|
selector | ×Ö·û´®Öµ£¬°üº¬ÓÃÓÚÆ¥ÅäÔªËØµÄÑ¡ÔñÆ÷±í´ïʽ¡£ |
Ïêϸ˵Ã÷
Èç¹û¸ø¶¨Ò»¸ö±íʾ DOM ÔªËØ¼¯ºÏµÄ jQuery ¶ÔÏó£¬.next() ·½·¨ÔÊÐíÎÒÃÇËÑË÷ DOM Ê÷ÖеÄÔªËØ½ô¸úµÄͬ°ûÔªËØ£¬²¢ÓÃÆ¥ÅäÔªËØ¹¹ÔìÐ嵀 jQuery ¶ÔÏó¡£
¸Ã·½·¨½ÓÊÜ¿ÉÑ¡µÄÑ¡ÔñÆ÷±í´ïʽ£¬ÀàÐÍÓëÎÒ´«µÝµ½ $() º¯ÊýÖеÄÏàͬ¡£Èç¹û½ô¸úµÄͬ°ûÔªËØÆ¥Åä¸ÃÑ¡ÔñÆ÷£¬Ôò»áÁôÔÚй¹ÔìµÄ jQuery ¶ÔÏóÖУ»·ñÔò»á½«Ö®Åųý¡£
Çë˼¿¼ÏÂÃæÕâ¸ö´øÓмòµ¥ÁбíµÄÒ³Ãæ£º
<ul> <li>list item 1</li> <li>list item 2</li> <li class="third-item">list item 3</li> <li>list item 4</li> <li>list item 5</li> </ul>
Èç¹ûÎÒÃÇ´ÓÏîÄ¿Èý¿ªÊ¼£¬ÔòÄܹ»ÕÒµ½Æäºó³öÏÖµÄÔªËØ£º
$('li.third-item').next()
.css('background-color', 'red');
Õâ´Îµ÷ÓõĽá¹ûÊÇ£¬ÏîÄ¿ 4 ±»ÉèÖÃΪºìÉ«±³¾°¡£ÓÉÓÚÎÒÃÇûÓÐÓ¦ÓÃÑ¡ÔñÆ÷±í´ïʽ£¬½ô¸úµÄÕâ¸öÔªËØºÜÃ÷È·µØ±»°üÀ¨Îª¶ÔÏóµÄÒ»²¿·Ö¡£Èç¹ûÎÒÃÇÒѾӦÓÃÁËÑ¡ÔñÆ÷£¬ÔÚ°üº¬Ëü֮ǰ»á¼ì²âÊÇ·ñÆ¥Åä¡£