用jquery添加新的css规则的最佳方法是什么？
我在网页上动态插入一些html（在我检测到用户的事件后）。 这个html需要一些CSS样式，我想知道什么是最干净的方法，使用jQuery。 我不是网站开发人员，因此我无法将这些规则添加到原始css中。
假设我已经插入了一些没有样式的html，包括一个formElement类。 我可以在我的文档中写一个新的块，例如：
my_html = ''; my_html += ' .formElement {'; my_html += ' display: block;'; my_html += ' width: 240px;'; my_html += ' position: relative;'; my_html += ' padding: 4px 0;'; my_html += ' }'; my_html += ''; my_html = $(my_html); $('body').prepend(my_html);
或者，我可以使用css方法：
$('.formElement').css({ 'display': 'block', 'width': '240px', 'position': 'relative', 'padding': '4px 0' });
哪种解决方案最好/最干净？
编辑：
由于我不能直接在CSS中添加规则，我将坚持使用jQuery的css方法。 其他一些相关问题也提供了解决方案：
- 在运行时使用jQuery创建CSS规则/类
- 使用JavaScript或jQuery更改CSS规则
我不能真正使用jQuery插件，但如果可以，我肯定会使用jQuery.Rule
谢谢大家的宝贵帮助。
老实说，最好的方法可能都不是。 如果我必须选择一个，jquery css方法将是我的选择，只是因为它更干净，但是，考虑这个替代方案以获得更好的性能和更清晰的代码：
创建CSS类以在需要时附加到元素。 例如：
.formElementAlpha { width:240px; padding:4px 0; } .formElementBravo { width:400px; height:50px; padding:20px 0; line-height:50px; font-size:30px; }
然后，使用jquery，当你需要它时：
$('.formElement').addClass('formElementAlpha');
要么
$('.formElement[name="bigUsernameInput"]').addClass('formElementBravo');
我将为需要根据某种用户交互或其他动态事件修改特定元素的实例重新设置jQuery css方法，该事件要求您使用JavaScript变量的值来确定要应用的样式。 因为看起来你已经知道如何设置它们的样式，所以让CSS完成工作。
不要将css和js混合在一起，特别是如果您的属性不包含计算值或动态值：只需定义一个CSS类
.mystyle { display: block; width: 240px; position: relative; padding: 4px 0; }
并设置类
$('.formElement').addClass('mystyle');
这个：
$('.formElement').css({ 'display': 'block', 'width': '240px', 'position': 'relative', 'padding': '4px 0' });
使用jquery .css（propertyName，value）
$('.formElement').css({ 'display': 'block', 'width': '240px', 'position': 'relative', 'padding': '4px 0' });
这是您提供的解决方案中最好的。
但是，我会创建一个具有所有属性的类来表示你的yourCSS并将该类添加到该元素：
$('.formElement').addClass('yourCSS');
你的第二个选择：
$('.formElement').css({ 'display': 'block', 'width': '240px', 'position': 'relative', 'padding': '4px 0' });
这是迄今为止最干净的解决方案！
HTML
JS
my_html += ' .formElement {'; my_html += ' display: block;'; my_html += ' width: 240px;'; my_html += ' position: relative;'; my_html += ' padding: 4px 0;'; my_html += ' }'; $('#customCSS').html(my_html)