Question

我有JS运行来删除一个类＆＃34;修改＆＃34;来自表单元素的所有后代。哪个会表现更好？

$form.find('*').removeClass('modified');

或

$form.find('.modified').removeClass('modified');

还是有更好的方法吗？

谢谢！

Answer 1

如果您正在寻找性能，我会尝试使用原生JavaScript。以下脚本应该执行得非常快，但说实话，我现在没有时间来衡量性能。无论如何，这是一个香草JS版本：

var form_elem = document.getElementById('form');
var elements = form_elem.getElementsByClassName('modified');

while(elements.length > 0){
    elements[0].classList.remove('modified');
}

<form id="form">
<span class="modified">1</span>
<span class="modified">2</span>
<span class="modified">3</span>
<span class="modified">4</span>
<span class="modified">5</span>
<span class="modified">6</span>
<span class="modified">7</span>
<span class="modified">
    <span class="modified">
        <span class="modified">9</span>
    </span>
</span>
</form>

Answer 2

第二种方式（.find('.modified')）在性能方面更好，适用于所有主流桌面浏览器（Opera，IE，Edge，Chrome，Firefox，Chromium，未测试移动浏览器）。

Google Chrome 61 ：22K操作/秒vs 214K操作/秒 Firefox 55 ：26K op / s vs 342K op / s Chromium 59 ：21K op / s vs 184K op / s Opera 46.0 ：22K op / s vs 198K op / s Edge 25.10586.672 ：5K op / s vs 64K op / s IE 11.962.10586 ：6K op / s vs 117K op / s。

可能会因浏览器而异。

以下是测试设置： https://jsperf.com/jquery-remove-classes/1

JQuery性能：删除类

2 个答案: