在这种情况下,伪元素会成为键选择器吗？或者客户端会抓住所有元素吗？
换句话说,*：after和*表现之间有什么区别？
[编辑.愚蠢的例子.我的错.]
为了澄清,我正在尝试使用css绘制某些东西并发现自己使用了很多伪元素.如果我可以通过写作节省一些时间,只是徘徊
*:after,
*:before {
content:'';
}
和它的资源成本.
谢谢.
Would the pseudo element become the key selector in this case?
从技术上讲,选择器的主题是*,意味着与*匹配的任何元素将是生成伪元素的元素.
当涉及伪元素时,术语“密钥选择器”没有很好地定义,而且与主题选择器的概念不同,它实际上是一个实现细节.如果“键选择器”的意思是“表示被渲染的盒子的选择器”,那么我想你可以说伪元素是键选择器.但是,我不熟悉实现细节,因为我不是实现者.
无论哪种方式,可以安全地假设客户端遍历DOM,并且对于它挑选的每个元素：
>尝试将元素与选择器匹配,暂时忽略伪元素(在本例中为*).
>如果元素与选择器匹配,则尝试创建一个伪元素框作为此元素框的子元素(如果生成的伪元素,如：before和：after),如果它适用(某些元素不能生成伪元素)元件).
>将样式应用于伪元素框并将其渲染为与任何其他框一样.
两个选择器之间的区别在于前者包含伪元素,而后者不包含伪元素.由于它们做了根本不同的事情,因此按性能比较它们是不公平的.但是,它们都尝试匹配DOM中的任何元素,因为它们都使用相同的catch-all选择器*,因此除非进行任何特殊优化,否则可以安全地假设*：之后的唯一开销是实际生成和渲染伪元素.
因为我们讨论的是性能问题,所以请记住,将元素与*匹配几乎是瞬时的,因为它基本上是一个保证匹配;只有当你将它与更复杂的选择器结合起来时才会在选择器级别上变得更加昂贵,并且最终它的性能随着DOM中的元素数量而变得最大,但它仍然不像实际渲染样式那么昂贵除非你有成千上万的元素.
至于你的用例,我的意见是你通常不需要为每个元素创建伪元素.如果您正在使用CSS绘制内容,请查看是否可以按上下文限制选择器,以避免在整个DOM中呈现不必要的框,例如如果您只在具有特定ID的元素中绘图：
#mycanvas *:after,
#mycanvas *:before {
content:'';
}