element.classList.toggle中第二个参数的重点是什么？

Question

来自MDN:

toggle方法有一个可选的第二个参数,它将强制根据第二个参数的真实性添加或删除类名.例如,要删除一个类(如果它存在与否),您可以调用element.classList.toggle('classToBeRemoved', false);并添加一个类(如果存在或不存在),您可以调用element.classList.toggle('classToBeAdded', true);

据我所知,这classList是一个令牌列表,与数组不同,列表不能包含重复项.因此,将一个项目添加到已经拥有它的列表中不会执行任何操作,并且从不包含它的列表中删除项目(显然)不会执行任何操作,这意味着它与之classList.toggle(className, true)相同classList.add(className)且classList.toggle(className, false)完全相同classList.remove(className).

我错过了什么吗？

PS无需警告IE兼容性问题.

Answer 1

它只会让你做这样的事情:

el.classList.toggleClass("abc", someBool);

而不是这个:

if(someBool){
    el.classList.add("abc");
} else {
    el.classList.remove("abc");
}

Answer 2

与classList.add()/ remove()不同,classList.toggle()在添加类时返回true,而在删除类时返回false - add()和remove()返回undefined.

FYI IE11不支持可选的第二个添加/删除参数classList.toggle().