4-30 jq学习笔记(选择)

Posted 2020-11-02 xfym888

1 选择方式a--通过名字  

        $(‘标签‘)     例子:$(‘a‘)选择全部标签

       $(‘#id名‘)   例子:$(‘#a1‘)选择id等于 a1的标签    $(‘#a1:属性值ddd‘)选择全部id等于a1  且  包含‘‘属性值ddd""的标签
       $(‘.类名‘)     例子:$(‘.a1‘)选择全部类名为a1的标签  :$(‘div.a1‘)选择类型为div 的标签 且 类名等于a1的标签

 例子 :$(‘.a1  div‘)选择全部类名为a1标签下所包含的全部层级div标签

  例子 :$(‘.a1>div‘)选择全部类名为a1标签下所包含的全部一级子div标签

                         例子:$(‘.a1.b1‘)选择全部类名为a1且为b1的标签

                        例子 :$(‘.a1,b1‘)选择全部类名为a1或b1的标签

        $([属性名])   及   $([属性名=属性值]) 

                         例子 :$(‘[for]‘)选择全部属性名包含 for的标签

                         例子 :$("[type=‘text‘]"‘)选择全部属性名为type且 值为text的标签

                         例子 :$(‘:text‘)表单类型如input标签,可以直接简写为属性值为text的input标签

        $(:contains("内容"))  按标签所包含的文本内容进行选择

 

2 选择方式b-通过筛选器

      $(this).next()  当前选择集合的下一个标签,可设条件进行精确筛选

                            *扩展   $(this).nextall()  从当前开始向后选,一直选到第一个  

 

                                       $(this).nextuntil(条件)  从当前开始向后选,一直选到符合条件的标签为止

      $(this).prev()    当前选择集合的上一个标签,可设条件进行精确筛选 

                            *扩展   $(this).prevall()  从当前开始向前选,一直选到第一个  

                                       $(this).prevuntil(条件)  从当前开始向前选,一直选到符合条件的标签为止

      $(this).parent() 当前选择集合的父标签,可设条件进行精确筛选    *扩展   $(this).parents()  将逐级选父级,一直选到最顶层

       $(this).childern() 当前选择集合的子标签,可设条件进行精确筛选
       $(this).siblings() 当前选择集合的兄弟标签,可设条件进行精确筛选

 

3 选择方式c-通过筛选器链式选择

      $(this).next(条件
).parent(条件).siblings(条件).first()   取当前标签的下一个的父标签的兄弟标签集合的第一个 

 

4 选择方式d-杂七杂八的选择

      $(this).eq(1)  取当前标签集合的第2个

      $(this).last()  取当前标签集合的最后1个

      $(this).find(条件) 取当前标签集合的符合条件的标签