Question

有没有办法删除通过CSS样式表应用的CSS属性？

示例：

test.css

.test { background: red; }

的test.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="test.css">

<div class="test">Foo</div>

<script>
$('.test').each(function(i, block) {
    $(this).css('background', '');
});
</script>

是的，如果它是内联添加的，它将删除CSS属性：

Before                                        After
<div class="test" style="background: red">    <div class="test">

但问题是关于删除基于样式表的属性，而不是内联属性。

另外，我知道我可以使用“透明”，它会起作用：

$(this).css('background', 'transparent');

但同样，这有点超出了我的问题范围。

Answer 1

您无法修改样式表中的值，您可以像在示例中那样覆盖它

$(this).css('background', 'transparent');

或者在样式表中有另一个具有所需属性的类，并用JS替换类

$(this).removeClass('test');
$(this).addClass('your-other-class');

Answer 2

网站运行时不应修改CSS文件。

一个小技巧可能是 SUBSTITUTE 您当前活动的CSS文件与之前自定义的另一个。

你可以这样做（你必须使用JQUERY）

$('link[href="yourfirstfile.css"]').attr('href','yoursecondfile.css');

或者你可以准备第二堂课，在你需要的时候替换你的第一堂课

Answer 3

如果不从html元素中删除类，则无法删除样式。您只能通过使用javascript操作DOM或更新HTML来实现此目的。

但您可以通过在之后导入新的css文件来覆盖样式。

OR

在 css导入后的html 中添加样式元素，以便在不使用javascript的情况下覆盖css中的样式。

OR

通过向HTML源添加内联样式元素或使用Javascript。

删除通过样式表应用的CSS属性

3 个答案: