Jquery的is( ),hasClass( ),find( )等表达式使用异同。。

有时候它们能实现一些同样的效果,但方式不一样。可以比较学习一下。

(1)

首先要注意,is( ),hasClass(  ),两者都是返回布尔值,并非对象本身,而find(  )是返回在子元素中查找到的对象,注意是对象实体。

<ul>

    <li>1</li>
    <li class="m">2</li>
    <li>3</li>

  </ul>

注册事件:

$("ul li").click(
        function(  ){
            if($(this).hasClass("m")){
                alert(1);
            }
        }
    )

    if($(this).hasClass("m"))也可以替换成if($(this).is(".m")),注意hasClass(  )参数只要class值就可以不需要再加点号。所以$(this)与hasClass( ),is(  )这些是不错的搭配,可以用来建立if 语句。

      hasClass(   )比较局限,只能判断有没这个类,而is还能判断有没这个id,比如<li class="m">2</li>换成<li id="m">2</li>,就不能用hasClass(  )来判断了,只能用is("#m")的形式,所以is()更灵活。

(2)   

  find(  )是直接在子元素中我们特定需要的,比如$("ul").find(".m"),这样就可以直接匹配到<li class="m">2</li>但它有个缺点,就是必须事先知道这个元素的类或id是多少,或者标签名是什么,它不太适合与$(this)来进行循环遍经历操作搭配。

    <ul>       

        <li>1</li>
        <li class="m">2</li>
        <li>3</li>

    </ul>

    注意$("ul li ").find(".m")这样的操作是错误的,因为find(  )是用来在子代中查找的。很明显ul li的子代是文本元素,而我们要找到的是个li,所以只能去从父级ul去查找,$("ul").find(".m")才正确。

    $("ul").find(".m")等价于$("ul li.m").css("color","red");


(3)

$("ul li").is(".m"),注意这里可以不需要each(  ),会自动匹配集合中所有的li元素,然后看其中的li的是否有class值为m的,这里很明显要返回个 ture。


(4)

<p id="f" class="a b">我们都是好孩子</p>

如果class有两个值的话,也可以判断。

$("#f").hasClass("a b")         // hasClass的话,类名不需要带点号,两个类之间不需要带逗号

$("#f").is(".a,.b")        // is的话,完全相反,类名需要带点号,两个类之间需要带逗号

(5)

$(this).parent(  ).find("span")是个不错的组合。。。



   













  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值