JavaScript style.display="none" 还是 jQuery .hide() 更高效？答案

【问题标题】：JavaScript style.display="none" or jQuery .hide() is more efficient?JavaScript style.display="none" 还是 jQuery .hide() 更高效？
【发布时间】：2012-11-21 05:07:02
【问题描述】：

document.getElementById("elementId").style.display="none"

在 JavaScript 中用于隐藏元素。但是在 jQuery 中，

$("#elementId").hide();

用于相同目的。哪种方式更有效？我看过两个jQuery函数.hide()和.css("display","none")here之间的比较。

但我的问题是纯 JavaScript 是否比 jQuery 更高效？

【问题讨论】：

.hide() or display: none? jQuery的可能重复

标签： javascript jquery css performance

【解决方案1】：

谈效率：

document.getElementById( 'elemtId' ).style.display = 'none';

jQuery 使用其.show() 和.hide() 方法所做的是，它记住了元素的最后状态。这有时会派上用场，但既然你问的是效率，这并不重要。

【讨论】：

是的，这样效率更高，但不安全。在我的工作中，有一个巨大的 Web 应用程序几乎完全可以配置，因此根据上下文和配置，某些项目可能会或可能不会出现在页面中。如果页面中不存在此元素，则会导致错误（在未定义的对象上使用 .style）。使用 JQuery 你不会有这个问题，或者如果没有你应该在做之前检查if( document.getElementById( 'elemtId' ) )。

【解决方案2】：

a = 2;

对

a(2);
function a(nb) {
    lot;
    of = cross;
    browser();
    return handling(nb);
}

在您的看来，您认为最快的是什么？

【讨论】：

这个让我笑了，是最好的答案，很好。
不是最好的解释，但a lot; of = cross; browser(); handling... 的消息让我不给你反对票：P
@Florian -- 你忘记定义 browser 和 handling -- 这可能抛出错误

【解决方案3】：

在 99.999999% 的情况下，效率对于这种情况并不重要。做任何更容易阅读和/或维护的事情。

在我的应用程序中，我通常依靠类来提供隐藏和显示功能，例如 .addClass('isHidden')/.removeClass('isHidden')，如果我愿意，我可以使用 CSS3 为事物制作动画。它提供了更大的灵活性。

【讨论】：

我不会这么说的。根据调用的数量，这个可以成为一个因素，因为我们每次都调用 jQuery 构造方法。
如果你在一秒钟内这样做 > 10,000 次，它可能会变得很明显。我可以证明:)
喜欢 jsperf.com/jquery-hide-vs-native33 的链接。谢谢！

【解决方案4】：

是的。

Vanilla JS 总是更有效率。

【讨论】：

你总是必须知道你在做什么。你甚至可以非常低效地处理这个 Vanilla JS 框架。 ?