首页 > Web开发 > 详细

jquery的基础知识复习(基础选择器,属性选择器,层级选择器)

时间:2017-10-15 23:55:42      阅读:434      评论:0      收藏:0      [点我收藏+]

  

  1.基础选择器

        

      id选择器: $("#id"), 样式选择器:$(".className"),元素选择器:$("div"),$("*") 选择页面所有的元素
      
      同时使用两种选择器例如:id和元素 $("#id,div");,这里可以加上更多例如再加上一个样式的$("#id,div,.className");,
    

     2.属性选择器

    $("div[title]") 选择含有title的div元素;$("div[title]") 选择含有title=test的div元素 $("div[title=test]") ; 选择title属性不等于test的div元素:$("div[title!=test]"),这种选择方式会将没有title属性的div也选择上。
选择以title为te开始的div元素:$("div[title^=te]"),选择title以est结尾的div元素:$("div[title$=est]");选择title属性含有 es的div元素:$("div[title*=es]")
  
  多选择器复合使用: 选择隐藏域,含有title的属性的div,id为one,class为one的元素 $("input[type=hidden],div[title,#one,.one]") ,这样取的对象结果为并集。

    3.层级选择器

      A.选择body下的所有的div元素

        $("body div"); 请注意,这样选择的是body下的所有的子孙元素,例如div中还存在其他的div也会被选中。

      B.选择body下的子div

        $("body>div"); 请注意,这样选中的body的直接的子元素,也就是这样选择的是不包含孙元素div,区别就是加上了尖括号去掉了空格而已。

      C.选择在laber元素下一个的的input元素,

        $("laber+input"); 请注意,这样选择时,如果在htlm中存在两个laber元素,并且两个laber元素下面紧接着的都是input元素那么,这是会选中两个input元素。

      D.选择和form元素同辈的后面的所有兄弟元素

        $("form~div");这样选择的就是与form元素同级别的后面的所有div元素。

      E.选择与id为test的元素同级别的所有的div元素

        $("#test").parent().children("div");  注意:先获取该元素的父元素再获取该元素的所有的子元素中的div元素。

      

      

      

    

jquery的基础知识复习(基础选择器,属性选择器,层级选择器)

原文:http://www.cnblogs.com/ccbk/p/7674870.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!