返回 false,因为 input 元素的父元素是 p 元素:http://www.w3school.com.cn/jquery/traversing_is.asp
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");
}
根据选择器、DOM元素或 jQuery 对象来检测匹配元素集合,如果其中至少有
一个元素符合这个给定的表达式就返回true。 如果没有元素符合,或者表达式无效,都返回'false'。 '''注意:'''在jQuery 1.3
中才对所有表达式提供了支持。在先前版本中,如果提供了复杂的表达式,比如层级
选择器(比如 + , ~ 和 > ),始终会返回true
语法
- is(expr|obj|ele|fn)
参数 描述 expr 字符串值,包含供匹配当前元素集合的选择器表达式。 jQuery object 现有的jQuery对象,以匹配当前的元素。 element 一个用于匹配元素的DOM元素。 function(index) 一个函数用来作为测试元素的集合。它接受一个参数index,这是元素在jQuery集合的索引。在函数, this指的是当前的DOM元素。 例子 1
由于input元素的父元素是一个表单元素,所以返回true。
- # HTML 代码:
- <form><input type="checkbox" /></form>
- # jQuery 代码:
- $("input[type='checkbox']").parent().is("form")
结果:
- true
例子 2
判断点击li标签增加背景色为红色,如果点击的是第2个strong,当前的li增加背景色为绿色
- # 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>
- </ul>
- # jQuery 代码:
- $("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");
- }
- });
例子 3
下面是 is() 函数比较常用的用法
- // 是否是隐藏的
- $('#test').is(':visible');
- $('#test').is(':hide')
- // 判断input元素是否被选中
- $('input[name=chkNoChecked]').is(':checked');
- // 是否是第一个子元素
- $(this).is(":first-child");
- // 是否包含.blue,.red的class
- $(this).is(".blue,.red");
- // 文本中是否包含Peter这个词
- $(this).is(":contains('Peter')");