如何同时添加和删除类？

Question

我想在angular jqLit​​e或jQuery中一次添加和删除3个类。

目前我的代码如下：

$(element).addClass('x')
$(element).addClass('y')
$(element).removeClass('z')

这样做效率不高

1. 它更新DOM 3次
2. 它并不是一致的，因为有时它并没有按照我想要的顺序进行（例如在添加类x之前删除类z）

我正在寻找一次更新dom的方法。在我编写自己的方法之前，尝试使用RegExp

实现它

$(element).updateClass({add: ['x','y'], remove: ['z']}

我想知道是否已经有一个我错过的解决方案更容易，并且会给我控制我想要的类操作。

Answer 1

我最初将此作为评论发布， 但既然你收到了错误的答案，我也会在这里发布。

$(element).toggleClass('x y z');

Answer 2

我认为你想要ng-class属性：

<p ng-class="{x: if_x, y: if_y, z: if_z}">text</p>

在您的控制器中，将$scope.if_x设置为true以启用课程x，依此类推。

使用Angular的重点是避免在代码中设置DOM属性，而是使用Angular属性来控制DOM。

Answer 3

$（元素）.addClass（ 'X'）removeClass（ 'Y'）;

Answer 4

角度解决方案

将类设置为变量：

<div class="{{myclass}}"></div>

然后只需将变量更新为您想要的

$scope.myclass = "x y";

Answer 5

$（element）.switchClass（＆＃39; z＆＃39;，＆＃39; x y＆＃39;，0）;

documentation