CSS选择器问题：.class > ul > li和.class li哪个效率高？

请教如下两种写法，哪种效率高？现在的实际开发中有必要考虑这些吗？

<div class="class">
    <ul>
        <li>...</li>
        ...
    </ul>
</div>

.class > ul > li {...}
.class li {...}

---

肯定是第一个效率高，第一个条件比较多，需要去搜索的单位比较少。

---

问题重复了。

通常是第一种效率更高，而且没有歧义（第二种可能会应用到ol元素中的li上而第一种不会）

---

这个看你的应用场景了，如果li在class下很多层级，那就是第一种高，如果中间只有ul这一个层那就是第二种高，css的解析是从右往左解析的，如果是第一种就是先去找li再去找li上面的ul,然后才是.class;这样的话你其它类名下面有ul的话它也会去解析直到匹配到ul上面的.class才会停止

---

这个要根据不同的场景去判断，但有几个基本的原则应该知道：
1、原则是从选择器的右边到左边读取
2、越具体的关键选择器，其性能越高
所以实际这两种的效率都不是很高，效率最高的方法是给你需要的li节点加上类名
推荐你看看这几篇文章：
CSS选择器的优化
如何提升 CSS 选择器性能

---

重了 https://.com/q/1010000004444367