jquery：厌倦了css（）。css（）。css（）

Question

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

.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)

非常感谢任何帮助。

Answer 1

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

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

请注意，您可以对密钥使用这两种语法：zIndex，即可以直接在JavaScript中使用的camelcase版本和'z-index'（-所需的引号会破坏事物否则）。

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

Answer 2

在单独的类中定义样式

CSS

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

和js

.addClass('myCustomClass');

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

Answer 3

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