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

非常感谢任何帮助。

score 34 · Accepted Answer

是的，将对象传递给.css()（也在文档中提到）：

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

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

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

score 9 · Accepted Answer

在单独的类中定义样式

css

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

和js

.addClass('myCustomClass');

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

score 0 · Accepted Answer

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

3 回答 3