作为CSS选择器的最主要的两大选择器:ID选择器主要指的是通过DOM(Document Object Model)节点的ID选取节点,例如代码

在CSS中使用类选择器需要通过"."+"类名".

两者选择器均能够选取到DOM节点并给DOM节点添加样式.

1. 每个DOM节點允许有多个class,但是一般只允许拥有一个ID.一个DOM节点拥有多个class自然会产生样式的叠加,那么如果一个DOM节点拥有多个ID会出现什么情况?

   根据测试,发现瀏览器(测试时使用的Chrome)窗口预览的时候发现div的样式既没有颜色也没有宽度高度,这就说明一个DOM节点是不允许拥有多个ID

2. ID选择器对DOM节点的样式控制嘚优先级高于类选择器
3. 在符合W3C标准的页面中,ID选择器选取DOM节点的数量≤1,类选择器的选取DOM节点的数量可能为0,也可能为N(N≥1)。

1. ID唯一性,不能给多个DOM設置同一个ID.即不能通过ID选择器去控制多个DOM节点.虽然在测试代码

   发现两个div都被设置上了颜色但是这是不符合规范的。ID必须能够唯一的确定DOM節点！！

2. 在编写样式时尽量使用类选择器即使该DOM节点可能只出现一次。因为ID选择器的优先级比类选择器高,在后期样式的控制中会越来越難控制也许有人会问：我可不可以全篇都使用ID选择器，那么就不存在和类选择器比较优先级了理论上这是可以的，但是请注意上一点——ID必须能够唯一的确定DOM节点如果你全篇都使用ID选择器，那么即使两个DOM节点样式完全相同那么你也必须把节点样式写两遍, 如果后期要進行维护,那么你必须对两处的代码都进行维护！！！极大的增加了维护的成本。
3. 既然有了类选择器为什么还要规定一个ID选择器在一个完整的HTML+CSS+JavaScript的页面体系中，对一个DOM节点的ID使用最多的其实是JavaScript(因为通过ID能唯一的确定DOM节点方便控制),CSS中的使用的ID选择器一般情况下只会添加少量样式，更多对DOM节点的样式控制都是使用类选择器,既能够产生样式叠加,又方便后期的维护请尽量避免在CSS中使用大量的ID选择器
4. 常规情况下，CSS中會出现大量的ID选择器的情况——JavaScript插件配套的样式表中

相同点：可以应用于任何元素

1、ID選择器只能在文档中使用一次与类选择器不同，在一个HTML文档中ID选择器只能使用一次，而且仅一次而类选择器可以使用多次。

 

 2、可以使用类选择器词列表方法为一个元素同时设置多个样式我们可以为一个元素同时设多个样式，但只可以用类选择器的方法实现ID选择器昰不可以的（不能使用 ID 词列表）。
 
 

 下面的代码是正确的(完整代码见右侧代码编辑器)
 

 

 上面代码的作用是为“三年级”三个文字设置文本颜色為红色并且字号为25px
 
 

 下面的代码是不正确的(完整代码见右侧代码编辑器)