jquery添加css声明？答案

【问题标题】：jquery add css declarations?jquery添加css声明？
【发布时间】：2011-07-27 18:28:37
【问题描述】：

jquery 是否可以添加新的样式声明？

例如传递：

{ "body": { "font-size": "12px" }, "table": { "xyz": "123" } }

等等等等

到一个我不知道的函数，而不必选择这些元素并这样做：

$('body').css({"font-size": "12px"});
$('table').css({"xyz": "123"});

问题的第二部分，是否可以使用 jquery 为 :hover 伪类设置 css 或者我是否需要使用 .hover() 函数？如果可能的话，我只想应用 css 而不必处理鼠标输入/输出功能。

$('#element').find('a.thumbnail:hover').css({'background-color': '#efefef' });

不工作。

谢谢，卫斯理

【问题讨论】：

见：stackoverflow.com/questions/1348741/…

标签： javascript jquery css hover

【解决方案1】：

您可以通过document.stylesheets 集合使用纯javascript 更改样式表本身。在此处查看更多信息：http://www.howtocreate.co.uk/tutorials/javascript/domstylesheets

您也可以使用 jQuery 插件 jRule 来完成相同的结果：http://flesler.blogspot.com/2007/11/jqueryrule.html

【讨论】：

【解决方案2】：

第 1 部分的答案：

你必须定义一个函数来做到这一点 - 尝试这样的事情：

function styleit(json)
{
    //loop through the json
    $.each(item, function(i, style){
      //apply styles
      $(i).css(styles);
    }
}

第 2 部分的答案：

我会将 css 声明放在一个类中，例如：

.active a.thumbnail:hover { background-color: #efefef; }

然后使用 javascript 在父元素的上下文中切换类

$('#element').addClass('active');

【讨论】：

【解决方案3】：

对于第一部分，您正确地将样式添加到 body 和 table 标记。

对于第二部分，这个解决方案虽然使用.hover() 似乎是一个更简单的解决方案：

$('#element').hover(function() {
    $(this).css({'background-color': '#efefef' });
});

【讨论】：

hover() 有两个函数，背景不会恢复。
谢谢你，我一直只是使用回调，实际上并不知道它不会恢复。

【解决方案4】：

试试这个：

$('a.thumbnail').hover(
    function(){
        $(this).css({'background-color':'#efefef'});
    },
    function(){
        $(this).css({'background-color':'normal-color'});
    }
);

例如：http://jsfiddle.net/jfhpg/1/

希望对你有帮助。

【讨论】：

【解决方案5】：

您必须仅通过选择 dom 元素来完成。此外，为了设置悬停样式，您必须使用 css 设置样式或添加/删除类名。

【讨论】：

@Phil - 他在询问是否可以按照他想要的方式进行操作。我回答说他不可能按照自己的方式行事。我认为我不应该对此投反对票。我这里没有回答任何问题。
你没有答错，但完全是浪费答案。如果您对其进行编辑，我将删除反对票...