jquery：厌倦了 css().css().css()答案

【问题标题】：jquery: tired of css().css().css()jquery：厌倦了 css().css().css()
【发布时间】：2012-06-01 01:00:09
【问题描述】：

我真的厌倦了这样的语法：

.css('position','absolute').css('z-index',z-index)
.css('border','1px solid #00AFFF').css('margin','-1px 0px 0px -1px')
.css('left',pleft)

我想知道是否有任何方法可以在一个函数中传递所有参数，例如：

.foo('position':'absolute','z-index':z-index,
     'border':'1px solid #00AFFF','margin':'-1px 0px 0px -1px',
     'left':pleft)

非常感谢任何帮助。

【问题讨论】：

仅供参考，您的代码无效。 z-index 不是一个有效的变量名，但 z 减去 index 假设两个变量都存在；否则就是错误。
api.jquery.com 存在于此类问题。此外，如果您要进行如此多的内联 CSS 更改，请设置样式表并简单地使用 addClass("myclass");
是的，这只是一个例子......我从来没有这样的变量:)

【解决方案1】：

是的，将一个对象传递给.css()（也是mentioned in the docs）：

.css({
    position: 'absolute',
    left: pleft,
    zIndex: 123
    ...
});

请注意，您可以对键使用两种语法：zIndex，即可以直接在 JavaScript 中使用的驼峰式版本和 'z-index'（需要引用 - 否则会破坏事情）。

对于始终相同的选项 - 在您的情况下可能是 position、border 和 margin - 通过 class/id 选择器设置经典 CSS 规则可能是个好主意。然后您只需通过.css() 设置剩余的（动态）选项。

【讨论】：

【解决方案2】：

在单独的类中定义样式

css

.myCustomClass
{
     position: absolute;
     border: 1px solid #00AFFF
}

还有js

.addClass('myCustomClass');

如果样式太复杂，这很容易管理

【讨论】：

【解决方案3】：

$(element).css({'position':'absolute','z-index':zIndex,
     'border':'1px solid #00AFFF','margin':'-1px 0px 0px -1px',
     'left':pleft});

【讨论】：