CSS正则表达式id选择器与类选择器的性能

时间:2017-03-04 11:04:20

标签: html css performance css-selectors

让我们说我的第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{

}

从性能视角来看哪个更好?使用正则表达式选择器不好的做法,300个正则表达式选择器会对性能产生任何影响吗?

1 个答案:

答案 0 :(得分:-1)

在查看您需要的内容之后,为所有元素提供自定义CSS。对于此查询,应该记住一些要点。

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

  2. 使用CSS类 - 这是内联CSS的替代方式,但不像内联CSS那样是代码保护程序。如果您对所有元素使用相同类型的样式,那么如果您在循环中使用不同类型的样式则不准确。

  3. 希望这些建议能够指导你。谢谢和欢呼。