我有一个表，我显示/隐藏一个完整的列由jQuery通过CSS类不存在:
<table>
<thead>
<tr>
<th></th>
<th class="target"></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td class="target"></td>
<td></td>
</tr>
<tr>
<td></td>
<td class="target"></td>
<td></td>
</tr>
</tbody>
</table>
有了这个DOM，我可以在一行通过jQuery: $('.target').css('display'，'none');
这是完美的工作，但它是有效的使用CSS类没有定义?我应该为它创建一个空类吗?
<style>.target{}</style>
有没有副作用或者有没有更好的方法?
这里没有人完全提到的一件事是JavaScript(在本例中由jQuery辅助)不能直接修改文档的级联样式表。jQuery的css()方法仅仅改变匹配的元素的style属性集。CSS和JavaScript在这方面是完全不相关的。
$ (' .target ') . css(“显示”,“没有一个”);不会改变你的.target {} CSS声明。相反，这里发生的是任何具有“target”类的元素现在看起来像这样:
<element class="target" style="display:none;"></element>
没有预先定义CSS样式规则会有什么副作用吗?一点儿也没有呢。
还有更好的办法吗?就性能而言，确实有!
如何提高性能?
不是直接修改每个元素的样式，而是可以预先定义一个新类，并使用addClass()(另一个jQuery方法)将其添加到匹配的元素中。
基于这个已经存在的比较css()和addClass()的JSPerf，我们可以看到addClass()实际上要快得多:
我们自己如何实现它呢?
首先，我们可以在新的CSS声明中添加:
.hidden {
display: none;
}
您的HTML将保持不变，这个预定义的类只是为以后使用而存在。
我们现在可以修改JavaScript来使用addClass():
$('.target').addClass('hidden');
当运行这段代码时，不是直接修改每个匹配的“目标”元素的style属性，这个新类现在将被添加:
<element class="target hidden"></element>
使用新的“hidden”类，此元素将继承CSS中声明的样式，并且您的元素将被设置为不再显示。
