Jquery选择器个人总结

1、选择第一级子节点

    通过> 或者children方法实现

    $('#XtraTabPage8>.datagrid-ftable')

    $('#XtraTabPage8').children('.datagrid-ftable')

  选择第二个、第三个子元素

  $(".ant-table-row td:nth-child(2)")

2、选择所有的子节点,即后代节点

    通过空格实现

    $('#XtraTabPage8 .datagrid-ftable')

    用find函数

    $('#XtraTabPage8').find('.datagrid-ftable')

3、选择同级

       $('#XSmartDictLookup8').prev()

       $('#XSmartDictLookup8').next()

4、选择父级

    $('#XSmartDictLookup8').parent()

  $('#XSmartDictLookup8').parents('#InputPanel')  ---带筛选的选择父级,可以查找所有父级元素

5、模糊匹配

  $("div[class^='hint']"); ---class前缀为hint的所有div的jquery对象

  $("div[class$='hint']"); ---class后缀为hint的所有div的jquery对象

  $("div[class*='hint']"); ---class中包含hint的所有div的jquery对象

[属性名称] 匹配包含给定属性的元素
[att=value] 匹配包含给定属性的元素 (大小写区分)
[att*=value] 模糊匹配包含有value的原色
[att!=value] 不能是这个值
[att^=value] 以value开头的所有元素
[att$=value] 以value结尾的所有元素
[att1][att2][att3]… 匹配多个属性条件中的一个

class有多个时的模糊匹配。

例:<div style="white-space: normal; height: auto; width: 96px;" class="datagrid-cell datagrid-cell-c7-MXVALUE datagrid-editable">

模糊匹配JS为 $("div[class$='MXVALUE datagrid-editable']"); ---把class当做一个字符串看待

posted @ 2019-09-29 16:36  巡拜千年  阅读(348)  评论(0编辑  收藏  举报