is()

最新更新: 2018-09-07 15:25:54 阅读: 23次

定义和用法

根据选择器、DOM元素或 jQuery 对象来检测匹配元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true。
如果没有元素符合,或者表达式无效,都返回'false'。 '''注意:'''在jQuery 1.3中才对所有表达式提供了支持。在先前版本中,如果提供了复杂的表达式,比如层级选择器(比如 + , ~ 和 > ),始终会返回true

语法

  1. is(expr|obj|ele|fn)
参数 描述
expr 字符串值,包含供匹配当前元素集合的选择器表达式。
jQuery object 现有的jQuery对象,以匹配当前的元素。
element 一个用于匹配元素的DOM元素。
function(index) 一个函数用来作为测试元素的集合。它接受一个参数index,这是元素在jQuery集合的索引。在函数, this指的是当前的DOM元素。

例子 1

由于input元素的父元素是一个表单元素,所以返回true。

  1. # HTML 代码:
  2. <form><input type="checkbox" /></form>
  3. # jQuery 代码:
  4. $("input[type='checkbox']").parent().is("form")

结果:
true

例子 2

判断点击li标签增加背景色为红色,如果点击的是第2个strong,当前的li增加背景色为绿色

  1. # HTML 代码:
  2. <ul>
  3. <li><strong>list</strong> item 1 - one strong tag</li>
  4. <li><strong>list</strong> item <strong>2</strong> - two <span>strong tags</span></li>
  5. <li>list item 3</li>
  6. </ul>
  7. # jQuery 代码:
  8. $("li").click(function() {
  9. var $li = $(this),
  10. isWithTwo = $li.is(function() {
  11. return $('strong', this).length === 2;
  12. });
  13. if ( isWithTwo ) {
  14. $li.css("background-color", "green");
  15. } else {
  16. $li.css("background-color", "red");
  17. }
  18. });

例子 3

下面是 is() 函数比较常用的用法

  1. // 是否是隐藏的
  2. $('#test').is(':visible');
  3. // 判断input元素是否被选中
  4. $('input[name=chkNoChecked]').is(':checked');
  5. // 是否是第一个子元素
  6. $(this).is(":first-child");
  7. // 是否包含.blue,.red的class
  8. $(this).is(".blue,.red");
  9. // 文本中是否包含Peter这个词
  10. $(this).is(":contains('Peter')");