jQuery ±éÀú - is() ·½·¨
ʵÀý
·µ»Ø false£¬ÒòΪ input ÔªËØµÄ¸¸ÔªËØÊÇ p ÔªËØ£º
var isFormParent = $("input[type='checkbox']").parent().is("form")
;
$("div").text("isFormParent = " + isFormParent);
¶¨ÒåºÍÓ÷¨
is() ¸ù¾ÝÑ¡ÔñÆ÷¡¢ÔªËØ»ò jQuery ¶ÔÏóÀ´¼ì²âÆ¥ÅäÔªËØ¼¯ºÏ£¬Èç¹ûÕâÐ©ÔªËØÖÐÖÁÉÙÓÐÒ»¸öÔªËØÆ¥Å䏸¶¨µÄ²ÎÊý£¬Ôò·µ»Ø true¡£
Óï·¨
.is(selector)
²ÎÊý | ÃèÊö |
---|---|
selector | ×Ö·û´®Öµ£¬°üº¬Æ¥ÅäÔªËØµÄÑ¡ÔñÆ÷±í´ïʽ¡£ |
Ïêϸ˵Ã÷
ÓëÆäËûɸѡ·½·¨²»Í¬£¬.is() ²»´´½¨Ð嵀 jQuery ¶ÔÏó¡£Ïà·´£¬ËüÔÊÐíÎÒÃÇÔÚ²»ÐÞ¸Ä jQuery ¶ÔÏóÄÚÈݵÄÇé¿öÏÂ¶ÔÆä½øÐмì²â¡£ÕâÔÚ callback ÄÚ²¿Í¨³£±È½ÏÓÐÓ㬱ÈÈçʼþ´¦Àí³ÌÐò¡£
¼ÙÉèÎÒÃÇÓÐÒ»¸öÁÐ±í£¬ÆäÖÐÁ½¸öÏîÄ¿°üº¬×ÓÔªËØ£º
<ul> <li>list <strong>item 1</strong></li> <li><span>list item 2</span></li> <li>list item 3</li> </ul>
Äú¿ÉÒÔÏò <ul> ÔªËØÌí¼Ó click ´¦Àí³ÌÐò£¬È»ºó°Ñ´úÂëÏÞÖÆÎªÖ»Óе±ÁбíÏî±¾Éí£¬¶ø·Ç×ÓÔªËØ£¬±»µã»÷ʱ²Å½øÐд¥·¢£º
$("ul").click(function(event) {
var $target = $(event.target);
if ( $target.is("li")
) {
$target.css("background-color", "red");
}
});
ÏÖÔÚ£¬µ±Óû§µã»÷µÄÊǵÚÒ»¸öÁбíÏîÖеĵ¥´Ê "list" »òµÚÈý¸öÁбíÏîÖеÄÈκε¥´Êʱ£¬±»µã»÷µÄÁбíÏî»á±»ÉèÖÃΪºìÉ«±³¾°¡£²»¹ý£¬µ±Óû§µã»÷µÚÒ»¸öÁбíÏîÖÐµÄ item 1 »òµÚ¶þ¸öÁбíÏîÖеÄÈκε¥´Êʱ£¬¶¼²»»áÓÐÈκα仯£¬ÕâÊÇÒòΪÕâÉÏÃæµÄÇé¿öÖУ¬Ê¼þµÄÄ¿±ê·Ö±ðÊÇ <strong> ÊÇ <span>¡£
ÇëÄú×¢Ò⣬¶ÔÓÚ´øÓÐλÖÃÐÔÑ¡ÔñÆ÷µÄÑ¡ÔñÆ÷±í´ïʽ×Ö·û´®£¬±ÈÈç :first¡¢:gt() »òÕß :even£¬Î»ÖÃÐÔɸѡÊÇÕë¶Ô´«µÝµ½ .is() µÄ jQuery ¶ÔÏó½øÐе쬶ø·ÇÕë¶Ô°üº¬Îĵµ¡£ËùÒÔ¶ÔÓÚÉÏÃæµÄ HTML À´Ëµ£¬ÖîÈç $("li:first").is("li:last") µÄ±í´ïʽ·µ»Ø true£¬µ«ÊÇ $("li:first-child").is("li:last-child") ·µ»Ø false¡£
ʹÓú¯Êý
¸Ã·½·¨µÄµÚ¶þÖÖÓ÷¨ÊÇ£¬¶Ô»ùÓÚº¯Êý¶ø·ÇÑ¡ÔñÆ÷µÄÏà¹ØÔªËØµÄ±í´ïʽ½øÐÐÇóÖµ¡£¶ÔÓÚÿ¸öÔªËØÀ´Ëµ£¬Èç¹û¸Ãº¯Êý·µ»Ø true£¬Ôò .is() Ò²·µ»Ø true¡£ÀýÈ磬ÏÂÃæÊÇÉÔ΢¸´Ô HTML Ƭ¶Î£º
<ul> <li><strong>list</strong> item 1 - one strong tag</li> <li><strong>list</strong> item <strong>2</strong> - two <span>strong tags</span></li> <li>list item 3</li> <li>list item 4</li> <li>list item 5</li> </ul>
Äú¿ÉÒÔÏòÿ¸ö <li> Ìí¼Ó click ´¦Àí³ÌÐò£¬ÒÔ¼ÆËãÔÚ±»µã»÷µÄ <li> ÄÚ²¿ <strong> ÔªËØµÄÊýÄ¿£º
$("li").click(function() {
var $li = $(this),
isWithTwo = $li.is(function() {
return $('strong', this).length === 2;
})
;
if ( isWithTwo ) {
$li.css("background-color", "green");
} else {
$li.css("background-color", "red");
}
});