• jQuery的选择器总结


    ###jQuery的选择器


    • 不会返回undefined或null

    ####基本选择器

    id选择器:$('#id')
    element选择器:$('elem')
    class选择器:$('.class')
    通配符选择器:$('*')  //可以匹配所有的元素,不建议使用
    

    ####多项选择器

    $("selector1, selector2, ... selectorN") 
    //当选择了重复的元素时,jquery并不会重复选择
    //jquery会按照DOM中的元素顺序返回选择结果,并不会按照参数顺序返回选择结果
    

    ####层级选择器

    后代选择器:$('ancestor descendant')
    直接后代选择器:$('parent > child')
    二弟选择器:$('prev + next')  //只会选择在prev后并且相邻的next
    兄弟选择器:$('prev ~ sibling')  //会选择出prev所有的sibling兄弟
    

    ####属性选择器

    属性名选择器:$('[attr]')  //选择出包含该属性的所有元素
    属性值选择器:$('[attr=value]')  //选择属性为该值的所有元素
    非属性值选择器:$('[attr!=value]')  //选择属性不为该值的元素
    属性值头字段选择器:$('[attr^=value]')  //选择属性值开头为value字段的元素
    属性值尾字段选择器:$('[attr$=value]')  //选择属性值结尾为value字段的元素
    属性值字段选择器:$('[attr*=value]')  //选择属性值包含value字段的元素(正则)
    多属性选择器:$('[selector1][selector2][selectorN]')     //其中selector可以为上面任何一个选择器方法
    

    ####过滤器

    child系列

    $('father:first-child')
    $('father:last-child')
    $('father:nth-child(n)')  //n可以是数字(1开始)、even(表示偶数)、odd(表示奇数)、formula(方程)
    $('father:nth-last-child(n)')
    $('father:only-child')
    //可以指定子标签的类型,通过$('father > tag : first-child')
    //寻找father标签下的第一个标签是tag标签
    

    type系列

    $('father:first-of-type')
    $('father:last-of-type)
    $('father:nth-of-type(n)')  //n可以是数字、even(表示偶数)、odd(表示奇数)、formula(加减乘除方程,如2n+1)
    $('father:nth-last-of-type(n)')
    $('father:only-of-type')
    //可以指定子标签的类型,通过$('father > tag : first-of-type')
    //寻找father标签下的第一个tag标签
    

    ####表单相关

    表单选择器:$(':input')  //选择表单中input、textarea、select、button
    表单元素选择器:$(':type')  
    //可以用来单独选择password、radio、checkbox、image、reset、button、file
    表单状态选择器:$(':state')  
    //表单状态可以是enabled、disabled、checked(checkbox、select)、selected
    

    ####查找和过滤 * expr:字符串值,包含供匹配当前元素集合的选择器表达式 * object:现有的jQuery对象,以匹配当前的元素 * element:一个用于匹配的DOM元素 * fn一个函数用来作为测试元素的集合

    find(expr|object|element)  //递归搜索所有与指定表达式匹配的元素
    children([expr]) //在儿子中搜索与指定表达式匹配的元素
    parent([expr])  //取得一个包含所有匹配元素的父元素集合
    next([expr])、prev([expr]) //紧邻的后辈、前辈元素
    eq(index|-index)  //获取当前链式操作的第index个jQuery对象
    sibling([expr])  //匹配元素集合的同辈元素集合
    filter(expr|object|element|fn)  //筛选出与指定表达式匹配的元素集合
    
  • 相关阅读:
    持久层框架:MyBatis 3.2(2)
    持久层框架:MyBatis 3.2(1)
    循环结构(二)
    Android LayoutInflater详解
    为什么调用 FragmentPagerAdapter.notifyDataSetChanged() 并不能更新其 Fragment?
    Android Support v4、v7、v13的区别和应用场景
    Android的string-array数据源简单使用
    FragmentTabHost切换Fragment时避免重复加载UI
    Ubuntu 安装Chrome步骤
    慢慢来,让好习惯自然来
  • 原文地址:https://www.cnblogs.com/hannahzhao/p/11645035.html
Copyright © 2020-2023  润新知