以下哪种写法更高效(即更快):
$(elem).show();
或者$(elem).addClass(displayClass); // Where display class is "display: block;"
它们是完全相同的吗?
以下哪种写法更高效(即更快):
$(elem).show();
或者$(elem).addClass(displayClass); // Where display class is "display: block;"
它们是完全相同的吗?
这得看你需要做什么, 这两个方法的作用不同:
$(elem).show();
- 显示元素,恢复之前.hide()
隐藏或恢复元素类型的默认display
$(elem).addClass(displayClass);
- 添加一个类,并且始终具有特定的display
属性,不会真正恢复先前的样式 - 这种方法的灵活性较差哪个更快?毫无疑问是.addClass()
, 你可以在这里测试一下,与.show()
相比,它所执行的工作要少得多。但是,出于上述原因,它的功能不如.show()
灵活。
show()
和 hide()
方法很方便易用,但(在我看来)通过类名管理状态/外观确实是一种更强大、可维护的方法。实际上,您可以始终编写自己的小型 jQuery 插件,以添加/删除对您的应用程序有意义的类,以避免类名本身在代码中传播。它们不是完全相同的,它们的工作方式完全不同。在你的情况下,它们可能产生相同的效果,但不要指望。
例如,addClass
在所有情况下可能并不能使元素可见。如果元素具有其他样式优先于类(例如 ID 级别的 CSS 或内联样式等),则添加类将没有任何效果。
此外,设置 display:block
仅适用于您想要显示为块的元素。如果您有行内元素(或更糟糕的是表格)并尝试将它们显示为块,则结果可能与您预期的不同。
最后,.addClass()
明显比 .show()
对浏览器的处理更多,因此使用它并不能让您的网站变得更简单。
简而言之,如果这就是您想要实现的所有内容,请使用 .show()
- 这是正确的 jQuery 方法。
addClass
和removeClass
作为基础会是一个更好的主意。 - Akkuma