应该 hasClass 在 removeClass 之前 - 纯 Javascript

Posted 2023-03-29

【中文标题】应该 hasClass 在 removeClass 之前 - 纯 Javascript

【英文标题】：Should hasClass precede removeClass - pure Javascript

【发布时间】：2014-02-26 15:00:29

【问题描述】：

要删除类，我使用

getElementsByClassName("myclass1")[i].classList.remove("myclass2")

基于 html5 技术。 （我知道这不适用于 IE9-，仅适用于浏览器）。

据我所知，不检查类是否存在绝对没问题。对吧？

但是，就我而言，在我想要删除 myclass2 的页面上有许多带有 myclass1 的项目，但其中大多数（假设 90%）没有 myclass2。

检查类myclass2 是否存在将有助于提高性能，因为检查是否存在可能比删除快得多？ （仍然不确定我最后的陈述）

在我的情况下你会怎么做？

谢谢。

【问题讨论】：

您应该问自己一个问题：代码现在的工作方式（无论是否存在类都尝试删除）是性能瓶颈吗？如果不是，那么这可能是 premature optimization 的情况（那里有两个有用的链接）。

classList.remove("myclass2") 还需要在删除它之前检查它是否存在（无论如何它都需要找到它）。实际上，如果您自己检查它是否存在并且确实存在，那么调用 .remove("myclass2") 它将再次检查。因此，添加该检查实际上可能会更慢:)

@Daniël Knippers 是的，但如果页面上有很多 myclass2 的话。但是，在我的情况下，大约 90% 没有它，但我必须通过所有元素来检查和删除它们。所以这不会太慢，但我可以通过检查是否存在来赢得更多。

可能我理解的不正确。但我得到的是你有一组元素，有类myclass1（可能还有myclass2）。您想从这些元素中删除 myclass2。您询问在调用.remove("myclass2") 之前首先检查每个元素是否有myclass2 是否更快。我回答说.remove("myclass2") 已经包含该检查，所以它可能只是更慢:) 让我问一下，你想在哪里/如何“检查 myclass2 是否存在”？

@Haradzieniec 如果您的性能担忧是大量的myclass1 元素可能有也可能没有myclass2，那么您可以选择任何带有myclass2 的元素并过滤那些也有@ 的元素987654337@?如果您知道 myclass2 在较少的元素上，这可能会更高效，而不管这些元素上是否存在 myclass1。但是，您确实应该进行一些测试（如果您还没有），看看当前的方式是否适合您的使用，因为这可能都是白费力气。

【参考方案1】：

据我所知，不检查类是否存在绝对没问题。对吧？

是的。 remove 只会删除它找到的令牌。

检查类 myclass2 是否存在将有助于提高性能，因为检查是否存在可能比删除快得多？

几乎没有，因为它会在列表中被搜索两次。

【参考方案2】：

getElementsByClassName 支持多个类，所以如果你想简化它，你可以同时包含“myclass1”和“myclass2”作为参数，它只会返回那些同时拥有这两者的元素（更多信息请参见此处：@ 987654321@).

所以，在你的情况下，我建议使用这个：

getElementsByClassName("myclass1 myclass2")[i].classList.remove("myclass2")

【讨论】：

谢谢，但在我的情况下，这不是一个解决方案，因为我需要为所有具有 myclass1 的项目删除 myclass2 并且每个第 n 个 myclass1 都需要 myclass2 并进行一些计算。无论如何，谢谢您的回答，因为这绝对是其他任何人的选择，这是有道理的。