jQuery只允许元素上的一组类中的一个？

Question

我有一个元素，它使用jQuery动态添加了许多类，并从中删除了一些类。 我想确保在给定的时间元素上只有一组类中的一个。

例如，我可以使用.blue_element类来定义字体颜色，背景色，边框颜色等，而我不希望将.blue_element类与.red_element类或.yellow_element类同时使用，但我不介意与.small_element类或.big_element类同时存在。

当前方法：

$('#target_element').removeClass('yellow_element').removeClass('red_element').addClass('blue_element')

这可以正常工作，但似乎会产生错误的风险，例如，如果我添加了.purple_element类，却忘记了修改删除代码。

我正在以比示例更大的规模进行此操作，并且可能会非常频繁地添加和删除类，因此如果我这样做，我期望会犯一些笨拙的错误。 有没有更有效的方法可以做到这一点？

Answer 1

而不是使用jQuery，请使用本机Mathod

document.getElementById("target_element").className = 'blue_element';

上面的代码将删除所有类，并仅保留/添加“ blue_element”；