在序列中排序简单的选择器

Question

这仅仅是一个关于良好实践的概念性问题.

---

问题很简单.是否有任何"正确"的方式来订购jQuery/CSS选择器的部分？例如,假设我有一个具有以下属性的元素:

<div class="red green blue" id="someDiv" anAttr="something">

为了更好地衡量,我们也会在它被徘徊时瞄准它.

---

以下选择器之间有什么区别吗？:

div.red.green.blue#someDiv[anAttr='something']:hover
div#someDiv.red.green.blue[anAttr='something']:hover
div.red#someDiv[anAttr='something']:hover.blue.green
div[anAttr='something'].blue:hover#someDiv.red.green

意思是,目标的顺序是否重要,真的吗？或者我可以把它们放在任何 - 我想要的顺序？

根据这个JSFiddle,他们都在技术上工作.

Answer 1

5.2 选择器语法

简单选择器是类型选择器或通用选择器，后面紧跟着零个或多个属性选择器、ID 选择器或伪类，顺序任意。如果简单选择器的所有组件都匹配，则简单选择器匹配。

注意：CSS 2.1 中使用的术语与 CSS3 中使用的术语不同。例如，“简单选择器”指的是 CSS3 中的选择器比 CSS 2.1 中的选择器更小的部分。请参阅 CSS3 选择器模块 [CSS3SEL]。

选择器是由组合器分隔的一个或多个简单选择器组成的链。组合符包括：空格、“>”和“+”。组合器与其周围的简单选择器之间可能会出现空白。

文档树中与选择器匹配的元素称为选择器的主题。由单个简单选择器组成的选择器匹配任何满足其要求的元素。在链前面添加一个简单选择器和组合器会施加额外的匹配约束，因此选择器的主题始终是与最后一个简单选择器匹配的元素的子集。

一个伪元素可以附加到链中的最后一个简单选择器，在这种情况下，样式信息适用于每个主题的子部分。

来自：w3.org