jquery选择器的总结

Posted 2021-03-06 kpzd

1、元素选择器：$("标签名")
例：$("p") 选择p元素

2、属性选择器：$([属性=值])
例：$("[href=‘abc’]") 选取所有带有 href=‘abc’属性的元素

3、元素属性选择器：$("标签名[属性 符号 值][属性 符号 值]...")
例：
$("input[name=‘test‘]") 选择所有的name属性等于‘test‘的input元素 
$("input[name!=‘test‘]") 选择所有的name属性不等于‘test‘的input元素 
$("input[name^=‘test‘]") 选择所有的name属性以‘test‘开头的input元素 
$("input[name$=‘test‘]") 选择所有的name属性以‘test‘结尾的input元素 
$("input[name*=‘test‘]") 选择所有的name属性包含‘test‘的input元素
多属性组合： $("input[id][name=‘test‘]") 选择所有的name属性等于‘test‘的并且有id属性的input元素

(注 ^ 已开头   $ 以结尾 * 包含)

4、$(":input")和=$("input")区别
$(":input")获取页面所有表单类型的元素，比如select,textarea等，也包括button元素
$("input")获取页面所有input类型的元素

 

5、同时包含多个属性(交集)
$(".a.b")同时包含类a和类b的元素

6、包含某个属性(并集)
$(".a,.b")包含类a或者类b的元素

————————————————
版权声明：本文为CSDN博主「j11j11」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/j11j11/article/details/81002180

通用二

    通用语法：

$(‘具体的选择字符串‘);
    选择结果可能是单个或多个对象。

    下面涉及到索引的，多是从0开始计数。

    如果选择器中包含特殊字符，可以用两个斜杠转义。

    选择器总览：

基本的选择器
元素选择器element
ID选择器#id
类选择器.class
匹配所有元素通常用于结合上下文搜索*
根据多个规则获取元素selector1,selector2,selectorN
层次结构中选取
选取指定元素内所有匹配的元素ancestor descendant
选择指定父元素下匹配的子元素parent>child
选择所有紧接在指定元素后指定的匹配元素prev+next
选择指定元素之后的所有指定的匹配元素prev~siblings
更近一步
获取第一个元素:first
获取最后个元素:last
去除所有与给定选择器匹配的元素:not(selector)
匹配所有索引值为偶数的元素:even
匹配所有索引值为奇数的元素:old
匹配一个给定索引值的元素:eq(index)
匹配所有大于给定索引值的元素:gt(index)
匹配所有小于给定索引值的元素:lt(index)
选择指定语言的所有元素:lang(language)
匹配如 h1 h2 h3之类的标题元素:header
匹配所有正在执行动画效果的元素:animated
匹配当前获取焦点的元素:focus
选择该文档的根元素:root
选择由文档URI的格式化识别码表示的目标元素:target
匹配包含给定文本的元素:contains(text)
匹配所有不包含子元素或者文本的空元素:empty
匹配含有选择器所匹配的元素的元素:has(selector)
匹配含有子元素或者文本的元素:parent
匹配所有不可见元素或者type为hidden的元素:hidden
匹配所有的可见元素:visible
匹配包含给定属性的元素[attribute]
匹配给定的属性是某个特定值的元素[attribute=value]
匹配所有不含有指定的属性或属性不等于特定值的元素[attribute!=value]
匹配给定的属性是以某些值开始的元素[attribute^=value]
匹配给定的属性是以某些值结尾的元素[attribute$=value]
匹配给定的属性是以包含某些值的元素[attribute*=value]
复合属性选择器需要同时满足多个条件时使用[selector1][selector2][selectorN]
匹配第一个子元素:first-child
选择所有相同的元素名称的第一个兄弟元素:first-of-type
匹配最后一个子元素:last-child
选择的所有元素之间具有相同元素名称的最后一个兄弟元素:last-of-type
匹配其父元素下的第N个子或奇偶元素:nth-child
选择所有他们父元素的第n个(计数从最后一个元素开始到第一个)子元素:nth-last-child()
选择的所有他们的父级元素的第n个(计数从最后一个元素到第一个)子元素:nth-last-of-type()
选择同属于一个父元素之下并且标签名相同的子元素中的第n个:nth-of-type()
如果某个元素是父元素中唯一的子元素那将会被匹配:only-child()
选择所有没有兄弟元素且具有相同的元素名称的元素:nth-last-of-type()
匹配所有 input textarea select 和 button 元素:input
匹配所有的单行文本框:text
匹配所有密码框:password
匹配所有单选按钮:radio
匹配所有复选框:checkbox
匹配所有提交按钮:submit
匹配所有图像域:image
匹配所有重置按钮:reset
匹配所有按钮:button
匹配所有文件域:file
匹配所有可用元素:enabled
匹配所有不可用元素:disabled
匹配所有选中的被选中元素:checked
匹配所有选中的option元素:selected
————————————————
版权声明：本文为CSDN博主「anxpp」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/anxpp/article/details/51485899