CSS Regex ID选择器与类选择器的性能

Question

假设我在第2000页上有。我想从自定义模块注入此页面元素（横幅）。该模块的CSS文件具有300 CSS选择器，每个选择器需要具有唯一的动态前缀，以避免与同一页面内的其他模块发生冲突。我不能使用1个唯一的ID选择器，因为可以加载更多的横幅，因此我需要使用类似的内容：

<div id="company_banner14"></div>
<div id="company_banner15"></div>
div[id^='company_banner']{
}

或

<div id="company_banner14" class="company_banner"></div>
<div id="company_banner15" class="company_banner"></div>
.company_banner{
}

从性能视图中有什么更好的？是否使用REGEX选择器不良练习，300 REGEX选择器是否会产生任何可见的性能影响？

Answer 1

查看所需的内容是所有元素的自定义CSS。对于此查询，应该牢记一些要点。

1. 使用内联CSS - 我认为，如果您不为一个元素使用长CSS，则Inline CSS是最好的解决方案。如果您的循环太多元素，它将为您的页面节省非常有价值的代码。例如，<div id="company_banner15" class="company_banner" style="Width:x; height:y;"></div>

2. 使用CSS类 - 它是内联CSS的替代方法，但不如Inline CSS那么避免代码。如果您使用相同类型的样式与所有元素类型，那么如果您在循环中使用不同类型的样式，则不准确。

希望这些建议能指导您。谢谢，欢呼。