jQuery.is() 函数
2018-11-23 16:52 更新
jQuery.is() 函数
定义和用法
is()
函数用于判断当前jQuery对象所匹配的元素是否符合指定的表达式。只要其中有至少一个元素符合该表达式就返回true
,否则返回false
。
这里的表达式包括:选择器(字符串)、DOM元素(Element)、jQuery对象、函数。
该函数属于jQuery
对象(实例)。
语法
jQueryObject.is( expr )
参数
参数 | 描述 |
---|---|
expr | 指定的表达式。 |
is()
函数实际上是判断当前jQuery对象所匹配的元素与指定表达式expr
所表示的元素是否存在交集,如果存在交集就返回true
,否则返回false
。
如果expr
参数为字符串,则将其视作jQuery选择器,用以表示该选择器所匹配的元素。
jQuery 1.6 新增支持:参数expr
可以为DOM元素(Element)、jQuery对象或函数。
如果expr
参数为函数,is()
函数将根据匹配的所有元素遍历执行该函数,函数中的this
将指向当前迭代的元素。is()
还会为函数传入一个参数:即该元素在匹配元素中的索引。
函数expr
的返回值应该为true
或者false
。该函数的返回值将决定is()
的返回值。循环执行时,只要该函数的返回值有一次为true
,is()
函数就立即返回true
,否则返回false
。
返回值
is()
函数的返回值为Boolean类型,以指示当前jQuery对象所匹配的元素与参数expr
所表示的元素是否存在交集,如果存在交集,则返回true
,否则返回false
。实例
实例
以下面这段代码为例:
/* HTML代码 */
<div id="n2">
<ul id="n3" data_id="12">
<li id="n4">item1</li>
<li id="n5" class="foo bar">item2</li>
<li id="n6" class="level-2">item3</li>
</ul>
</div>
<div id="n7">
<input id="n8" name="username" type="text" value="1">
<input id="n9" name="orders" type="checkbox" checked="checked" value="1">
</div>
</div>
/* jQuery代码 */
<script>
//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
$(document.body).append("<br/>" + html);
}
var $n3 = $("#n3");
w( $n3.is("ul") ); // true
w( $n3.is("[data_id]") ); // true
var $n5 = $("#n5");
w( $n5.is(".foo") ); // true
w( $n5.is("li") ); // true
w( $n5.is("ul li") ); // true
w( $n5.is("p li") ); // false
var n5 = document.getElementById("n5");
w( $n5.is(n5) ); // true
var $li = $("li");
w( $n5.is($li) ); // true
// 判断li元素是否含有类名"level-index",这里的index表示li元素的索引值(0、1、2……)
w( $li.is( function(index){
return $(this).hasClass("level-" + index);
} ) ); // true
var $input = $("input");
w( $input.is(":text") ); // true
w( $input.is(":checked") ); // true
var div = document.getElementsByTagName("div");
var $n7 = $("#n7");
w( $n7.is(div) ); // true
</script>
<div id="n1">
<div id="n2">
<ul id="n3" data_id="12">
<li id="n4">item1</li>
<li id="n5" class="foo bar">item2</li>
<li id="n6" class="level-2">item3</li>
</ul>
</div>
<div id="n7">
<input id="n8" name="username" type="text" value="1">
<input id="n9" name="orders" type="checkbox" checked="checked" value="1">
</div>
</div>
/* jQuery代码 */
<script>
//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
$(document.body).append("<br/>" + html);
}
var $n3 = $("#n3");
w( $n3.is("ul") ); // true
w( $n3.is("[data_id]") ); // true
var $n5 = $("#n5");
w( $n5.is(".foo") ); // true
w( $n5.is("li") ); // true
w( $n5.is("ul li") ); // true
w( $n5.is("p li") ); // false
var n5 = document.getElementById("n5");
w( $n5.is(n5) ); // true
var $li = $("li");
w( $n5.is($li) ); // true
// 判断li元素是否含有类名"level-index",这里的index表示li元素的索引值(0、1、2……)
w( $li.is( function(index){
return $(this).hasClass("level-" + index);
} ) ); // true
var $input = $("input");
w( $input.is(":text") ); // true
w( $input.is(":checked") ); // true
var div = document.getElementsByTagName("div");
var $n7 = $("#n7");
w( $n7.is(div) ); // true
</script>
尝试一下 »
点击 "尝试一下" 按钮查看在线实例
以上内容是否对您有帮助:
更多建议: