在jQuery中添加动态CSS有什么性能问题

我正在创建一个列表页面。其中大约20条记录将在页面加载时加载，其余部分将在滚动时动态添加。在我的应用程序中，我使用了包含引导样式的通用布局。但是对于这个特定的页面，我需要重写一些css。例如，我需要将td元素的填充减少到默认为8px的4 px。我有两种方法来做到这一点，无论是添加一个新的CSS文件，并有条件地包含在标题（标题是所有页面通用）或添加此页面的脚本。所以我添加了jquery脚本来实现这一点，这是简单的解决方案，没有太多的代码改变。在jQuery中添加动态CSS有什么性能问题

$("td").css({'padding':'8px 2px'});

当我这样做，我看到了内联CSS是被添加到该被追加到现有的表行的每个TD。我只是想知道是否有任何性能问题，或者如果我这样做会影响加载时间。

来源

2017-06-16 Vineesh

且不说更高效，您加载，而不是JQuery的使用纯js应该没有 – Vivick

为什么不在这样的目标特定的表在css中.page-table td {padding：8px 2px;}。所有你需要的是该表的类名 – karthick

添加一个特定的类是好的，但问题是添加一个新的CSS，我需要添加一个新的文件夹，新的文件（因为我们遵循一些标准，根据框架我们正在使用），所以我试图通过在脚本中添加css来避免这种情况。在我正在修改 – Vineesh

通过JavaScript添加样式有成本。成本包括脚本时间和重新计算样式。如果您仅通过js为少数记录添加样式（可以说是20），则此成本可忽略不计，但如果您试图为大量记录（1000）添加相同记录，则成本会变高。

由于您的用例是类型查看更多，您必须准备最糟糕的。

因此，最好在css中添加样式。

如果由于某些限制，您无法在css文件中添加规则。您可以创建一个动态的样式表，并添加到身体和使用类表格单元格，这仍然会高于$的.css（）

.padd-fix { 
padding:8px 2px; 
} 

$('td').addClass('padd-fix');

来源

2017-06-16 06:40:13 karthick

在jQuery中添加动态CSS有什么性能问题

回答

相关问题