我想知道，在 css 中获取每个直接子级是否有区别
tag > *
和
tag > :nth-child(n)
我知道通用选择器很慢，但我不知道，第 n 个子选择器在引擎盖下做什么。
我知道通用选择器很慢
不，通用选择器速度很快，因为它除了保证匹配之外什么都不做(有极少数例外，但在这里不适用(。它唯一"慢"的时候是当你有一个包含大量元素(数千个(的页面时——然后浏览器必须在每个元素上运行它，以确定它是否是任何父级的子元素。
使用:nth-child(n)是不必要地要求浏览器计算n表达式，而不是立即匹配元素而不问任何问题。即使浏览器确实优化了:nth-child(n)，你也会得到一个完全符合*工作方式的保证匹配。因此，您实际上只是通过使用:nth-child(n)(比*长12个整字节(来浪费空间，并且与仅使用*相比，它没有从中获得任何计算收益。
只需坚持使用通用选择器即可。或者，如果您担心 CSS 选择器的性能，您可以随时为每个所需的子元素添加一个类名并选择该类，但代价是标记膨胀。
*和:nth-child(n)之间的唯一功能区别是特异性——*的特异性为零，小于伪类。您通常不需要额外的特异性，因此，对于此用例，没有理由不坚持使用*。请参阅我对这个问题的回答，了解以特异性为中心的用例。
看看 w3school ：nth-child(( 选择器用于选择特定的子级，但如果要从容器中选择所有内容，请使用 * 选择器。在使用 ：nth-child(n( 的情况下，与使用 * 选择器相同，并且 * 使用更少的空间。
想知道它有帮助。