html - 我们应该使用 CSS 子选择器还是基于 CSS 类的选择器？

Question

在性能和优化方面，哪一种是在以下 HTML 代码中选择子 div 的更好方法？

选项 1：

<div class="parent-div">
  <div></div> <!--- child DIV !--->
</div>

// CSS

.parent-div > div {
  // Some CSS for child div
}

'

选项 2：（使用类名/id 选择）

<div class="parent-div">
   <div class="child-div"></div>
</div>

// CSS

 .child-div {
    // Some CSS for child div
 }

score 3 · Accepted Answer

选项 2 对代码可维护性更好。

<div class="block">
   <div class="block__elem"></div>
</div>

score 0 · Accepted Answer

这取决于，如果孩子是它自己的“组件”，我会给它一个班级。但如果它只是某个父组件的一部分，我会使用该.class > element选项。

我的观点是基于 Angular 和它的 CSS 在组件级别上分离的。这样做的好处是，您不会得到一个压倒性的文件。

2 回答 2