css选择器的长度影响效率吗?

css选择器的长度影响效率吗?
比如

.grid_col4 .user .user_avatar a 

和直接写

.user_avatar a 
阅读 6.2k
10 个回答

性能影响我觉得可以忽略不计,毕竟代码打包后,会更小。但是选择器的权重是有影响的,比如你给这个标签添加了多个Class,又有id,又通过后代或者子选择器都写了样式,那么就要特别注意权重的影响,可能会导致某些样式不生效的情况。

css选择器查找是从后往前的,肯定是层级越深查找性能越差,这也算是css优化之一。

影响的效率可以忽略不计,但是你的代码体积会变大,可阅读性变差!

影响的效率可忽略不计。如果能达到同样的效果,自然是越短的越方便。

但这两个选择器的优先级是不一样的,有时为了提高优先级会故意增加选择器的长度。

一般写样式用class,如果是js一般采纳id当然看你用什么框架了。现在都v8引擎了,你说的这个基本可以忽略的。

单条自然是没什么影响,可能5000条差不多的摞起来,可能才开始考虑性能影响吧。
.grid_col4 .user .user_avatar a .user_avatar a相比,后者会更直观,并且涉及到优先级冲突时,短选择器可以轻松的叠加选择子提升优先级。所以我觉得后者提升的是开发效率,性能什么的,倒不打紧。

肯定有的,不过那点时间太短,完全可以忽略不计,但是长了代码冗余量大

不便于阅读维护

当然有影响啊。

  1. 浏览器根据你的迭代器层级回溯查找dom计算量肯定大啊,不管慢多少肯定慢了
  2. 选择器写这么长,以后也不好维护,不利于阅读
  3. 作为一个有追求的开发者,追求代码清晰,简洁,优雅。

影响的,css从后往前解析,嵌套层级越深越影响性能

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题