javascript - 如何使这个 JavaScript/jQuery 代码更短

Question

有没有办法将它循环四次以使其更短？我正在尝试将类(class)从站着改成坐着，然后一次一个地改回来。

if(sitting > 0) {
    $('.standing:first-of-type').removeClass('standing').addClass('sitting');
} else {
    $('.sitting:first-of-type').removeClass('sitting').addClass('standing');
}

if(sitting > 1) {
    $('.standing:nth-of-type(2)').removeClass('standing').addClass('sitting');
} else {
    $('.sitting:nth-of-type(2)').removeClass('sitting').addClass('standing');
}

if(sitting > 2) {
    $('.standing:nth-of-type(3)').removeClass('standing').addClass('sitting');
} else {
    $('.sitting:nth-of-type(3)').removeClass('sitting').addClass('standing');
}

if(sitting > 3) {
    $('.standing:nth-of-type(4)').removeClass('standing').addClass('sitting');
} else {
    $('.sitting:nth-of-type(4)').removeClass('sitting').addClass('standing');
}

Answer 1

您可以使用 :lt和 :gt选择器。

:lt(index) 选择匹配集中索引小于 index 的所有元素。 :gt(index) 选择匹配集中索引大于 index 的所有元素。^{来自 jQuery Docs}

因为类 sitting 应该被添加到所有具有类 .standing 的元素，其 index 小于 sitting 变量值，:lt 选择器可以与变量 sitting 一起使用来选择这样的元素。那么addClass()和 removeClass()可用于 jQuery 元素集以分别添加和删除传递的类。

$('.standing:lt(' + sitting + ')').removeClass('standing').addClass('sitting');
$('.sitting:gt(' + sitting + ')').removeClass('sitting').addClass('standing');