Question

我们有addClass，removeClass，toggleClass

什么是jQuery等同于

document.getElementById("field").className=(someBoolean)?"pass":"fail";

但是使用保留现有类的方法之一？

我最接近的是我认为不那么优雅

$("#field")
  .toggleClass("pass",someBoolean)
  .toggleClass("fail",!someBoolean);

或使用vars

$("#field")
  .toggleClass(classWhenTrue,someBoolean)
  .toggleClass(classWhenFalse,!someBoolean);

示例：

$(function() {
  var pass = true;

    $("#field")
    .toggleClass("pass", pass)
    .toggleClass("fail", !pass);
    var classes = [...$("#field").get(0).classList];
    console.log(classes)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<input id="field" type="text" class="test fail done" />

Answer 1

就这样做。

$('#field').attr('class', someBoolean ? 'pass' : 'fail');

.attr('class', 'newClass')相当于element.className = 'newClass';

Answer 2

此？

$("#field").removeClass('pass fail').addClass(someBoolean ? 'pass' : 'fail');

Answer 3

你可以试试这个：

$('.submit-button')[ someBoolean ? 'addClass' : 'removeClass' ]('active')

三元或者terser setClass等价

3 个答案: