用jQuery查找元素

发布时间 2024-01-12 10:59:32作者: 哇咔咔,啊哈哈

问题:用jQuery查找元素。

回答:

  1. 使用选择器方法:

    • 使用标签选择器:$('标签名')
    • 使用类选择器:$('.类名')
    • 使用ID选择器:$('#元素ID')
    • 使用属性选择器:$('[属性名=属性值]')
    • 使用组合选择器:$('选择器1, 选择器2')
  2. 使用层级关系:

    • 选择父元素下的子元素:$('父元素').find('子元素')
    • 选择某个元素的直接子元素:$('父元素 > 子元素')
    • 选择某个元素的兄弟元素:$('元素 + 兄弟元素') 或者 $('元素 ~ 兄弟元素')
  3. 使用过滤器:

    • 使用:first选择器,选择第一个匹配的元素:$('选择器:first')
    • 使用:last选择器,选择最后一个匹配的元素:$('选择器:last')
    • 使用:eq选择器,选择第n个匹配的元素,n从0开始:$('选择器:eq(n)')
    • 使用:not选择器,选择不符合条件的元素:$('选择器:not(条件)')
    • 使用:even选择器,选择偶数位置的元素:$('选择器:even')
    • 使用:odd选择器,选择奇数位置的元素:$('选择器:odd')
    • 使用:contains选择器,选择包含特定文本的元素:$('选择器:contains(文本)')
  4. 使用jQuery扩展选择器:

    • 使用:has选择器,选择含有特定子元素的元素:$('选择器:has(子元素选择器)')
    • 使用:animated选择器,选择当前正在执行动画的元素:$('选择器:animated')
    • 使用:empty选择器,选择没有子元素或者没有文本的元素:$('选择器:empty')
    • 使用:siblings选择器,选择兄弟元素:$('选择器:siblings')
    • 使用:not(:empty)选择器,选择有文本的元素:$('选择器:not(:empty)')