CSS选择器

写在前面：

        我是一个php后端开发，对于前端技能一直都没有系统的学习过，只是有些基础概念和调试能力，现在开始对此技能进行系统学习，大神请忽略。第一篇文章就说下最基本的选择器

1. id选择器，权重最大。对于页面上的唯一id进行筛选 使用$("#btn"),进行选择
2. 类选择器，根据标签中class的值进行筛选，使用$('.articles')进行选择
3. 属性选择器，使用中括号,比如  a[href] {color:red;}，将a标签的href颜色变成红色， *[title]{color:red} 将所有元素的title颜色改成红色，
4. 伪类选择器， 使用冒号进行选择，比如 是用来选择某个类，或者说，选择的是某个类的状态。比如【:link】，【:visited】
5. 伪元素选择器，使用双冒号进行选择，::before，::after， 暂时不太明白，以后明白了进行确认

关系选择器

1. 后代选择器，包括子代，孙代所有的，使用 空格
2. 子代选择器，只包括子代的，使用>
3. 兄弟选择器，使用 ~
4. 相邻兄弟选择器，使用+

示例：

伪类选择器
$("ul li :first").html()  ul的子元素第一个li 的html的值
$("ul li :last").html()  ul的子元素最后一个li的html的值
属性选择器
$("a[href='http://xxx/xxx/cabinet/cabinet/edit/32']").html(111)  a标签下 href是http://xxx/xxx/cabinet/cabinet/edit/32的html的值
关系选择器
$("ul a").length ul下所有a元素的个数
$(".active a").length   类是active 的a标签的个数
$(".active>a").length  类是active的字标签是a的个数