jQuery选择器详细介绍(伪类选择器)


一、简单伪类选择器
jQuery选择器详细介绍(伪类选择器)
文章图片


二、子元素伪类选择器 jQuery选择器详细介绍(伪类选择器)
文章图片
jQuery选择器详细介绍(伪类选择器)
文章图片

总结: (1)“:first-child”是选择父元素下的第1个子元素(不区分元素类型),“:first-of-type”是选择父元素下某个元素类型的第1个子元素(区分元素类型) (2)在“:only-child选择器”中,父元素是只有一个子元素的。但是在“:only-of-type选择器”中,却可以有多个子元素。“:only-of-type”相对“:only-child”来说,只是多了一个type(元素类型)的限制。 通过以下例子来深入了解only-of-type的意义:

JSON Object Example - 锐客网 这是一个段落
这是一个段落
这是一个段落
这是一个span



jQuery选择器详细介绍(伪类选择器)
文章图片

JSON Object Example - 锐客网 这是一个段落
【jQuery选择器详细介绍(伪类选择器)】这是一个段落
这是一个span

jQuery选择器详细介绍(伪类选择器)
文章图片



三、可见性伪类选择器 jQuery选择器详细介绍(伪类选择器)
文章图片

JSON Object Example - 锐客网 #list * { display:none; }
我爱简简单单的
我爱简简单单的


浏览器端运行效果如下所示: jQuery选择器详细介绍(伪类选择器)
文章图片
jQuery选择器详细介绍(伪类选择器)
文章图片


四、内容伪类选择器 jQuery选择器详细介绍(伪类选择器)
文章图片

五、表单伪类选择器 jQuery选择器详细介绍(伪类选择器)
文章图片

六、表单属性伪类选择器 jQuery选择器详细介绍(伪类选择器)
文章图片

    推荐阅读