如何禁用和启用css规则

How to disable and enable css rule

本文关键字：css 规则 启用 何禁用      更新时间：2023-09-26

例如，如果我有

<style type='text/css' id='divcolorgreen'>
    div{
        color: green;
    }
</style>

我可以使用3种方法禁用css规则

  • 删除样式元素（重新应用以重新启用）
  • 修改它的内部html
  • 将内联规则逐个添加到每个元素中（更好地使用jquery）

有没有更简单的方法可以禁用/删除css规则？

这就是类的用途。通过给<body>标签分配一个类，您可以获得相同的功能：

<style type='text/css' id='divcolorgreen'>
    body.divcolorgreen div{
        color: green;
    }
</style>

然后如果<body>看起来像这样：

<body class="divcolorgreen">
    ...
</body>

则应用该规则。要禁用该规则，请删除提到的类：

<body>
    ...
</body>

好的，所以您正在尝试更改页面上所有div的颜色。

jQuery具有.css()，它允许您设置与选择器匹配的所有元素的样式。在你的情况下，它只是div。

设置：

$('div').css('color', 'yellow');

要删除：

$('div').css('color', '');

如果你不想使用jQuery，想法是一样的：

document.getElementsByTagName('div')为您提供页面上的所有div。您可以循环浏览它们并通过elem.style.color="yellow"; 更改它们的样式

1您可以通过jquery css( propertyName , value ) api来实现这一点，但根据我的说法，这是一种更简单的方法，因为如果有很多样式，比如您设置了字体、颜色、高度，。。。第二种方法更简单，也更节省的时间

 $("div").css("color", "yellow")

2您可以通过removeClass('someClass');和addClass('someClass'); 来完成此操作

例如，使用jQuery选择器以类"some"的除法元素为目标

html

<div class="some" ></div>

css

.some{ color: green; }

jquery

如果你想添加另一个类，可以使用addClass

$(".some").click( function(){
   $(this).addClass('someClass');
});

如果您想删除该类，请使用jQuery的removeClass方法：

$(".some").click( function(){
   $(this).removeClass('someClass');
});
相关文章：