Javascript更改样式表css属性[重复]答案

【问题标题】：Javascript changing stylesheet css property [duplicate]Javascript更改样式表css属性[重复]
【发布时间】：2014-10-12 21:52:21
【问题描述】：

首先我的英语不太好，但我相信它足以定义自己。
在 style.css 文件中

div.myclass
{
    width:20%;height:350px;background-color:#097;float:left;margin-right:5px;
}

在 html 文件中

<link rel="stylesheet" type="text/css" href="style.css">
<div class="myclass"></div>
<div class="myclass"></div>
<div class="myclass"></div>

你看，我有这个 div，我想用 jquery 更改它们的背景图像。

我尝试使用 .css() 函数

$('div.myclass').css({'background-image':'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQIW2P8DwSMIMAABQA+HQQDNlbHLwAAAABJRU5ErkJggg==)'})

但函数将 div 更改为此

<div class="myclass" style="background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQIW2P8DwSMIMAABQA+HQQDNlbHLwAAAABJRU5ErkJggg==);"></div>
<div class="myclass" style="background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQIW2P8DwSMIMAABQA+HQQDNlbHLwAAAABJRU5ErkJggg==);"></div>
<div class="myclass" style="background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQIW2P8DwSMIMAABQA+HQQDNlbHLwAAAABJRU5ErkJggg==);"></div>

我在问如何更改样式表文件中的 div css 规则

div.myclass
{
    width:20%;height:350px;background-color:#097;float:left;margin-right:5px;
}

到此

div.myclass
{
    width:20%;height:350px;background-color:#097;float:left;margin-right:5px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQIW2P8DwSMIMAABQA+HQQDNlbHLwAAAABJRU5ErkJggg==);
}

【问题讨论】：

有可能，但您为什么要这样做？最终结果是一样的。
@Blazemonger tny.cz/c5e3796a 看看这段文字，你就明白我为什么要这么做了
那没有回答任何问题；没有技术理由使用一种方法而不是另一种方法。 Gary Storey's answer 是您应该使用的方法。
@Blazemonger 我重新编辑了我的问题，我该怎么说，我想我无法明确定义自己。因为我的英语不太好：/
为什么我的问题被标记为重复。我不重复。 stackoverflow.com/questions/3164740/…这是不同的问题:(

标签： jquery css rule

【解决方案1】：

由于 javascript 是客户端并且仅在从服务器检索资源后运行，因此无法更改服务器上的 css 文件（如果这是您所要求的）。使用 css() 函数将改变内联样式，最终覆盖任何外部样式表。

这很好地回答了它： Can jQuery change css style definition? (not individual css of each element)

【讨论】：

我试过了，但我的浏览器有扩展名，他们使用 css 文件。 document.styleSheets[0] 你看，零不是全局值，它可能是某些浏览器的错误
我建议坚持使用内联 css。它会完成同样的事情。

【解决方案2】：

简单的答案是您不应该。您应该使用类并交换它们。但你可以这样做：

$('style').html('div { background-image: image.png; }');

【讨论】：

我可以做到，但我写了这个：jsbin.com/fizimihizabo/1/edit 用于定义自己的示例。我将解决方案用于其他项目
我重新编辑了我的问题，你能检查一下吗