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

Posted 2023-02-22

【中文标题】jquery：厌倦了 css().css().css()

【英文标题】：jquery: tired of 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');

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

【讨论】：

不回答他的问题，如果他需要一些动态值也不起作用。他仍然需要.css()。

@ThiefMaster 无论如何，对于某些情况，这是一个很好的解决方案，值得一提:)

这是正确的 ThiefMaster，我一直在将课程用于其他目的 - 但事实并非如此

【参考方案3】：

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