HTML DOM事件

Question

我有如下浏览器树。每个节点都是具有单独ID的div元素。当鼠标悬停在节点上时，我想更改样式。当用户左键单击或右键单击节点时，请执行某些操作。

问题1：一些文档说：hover选择器存在性能问题。因此，我改为监听mouseover和mouseout事件。推荐这种方式吗？

为了实现我的要求，我想监听每个节点的鼠标悬停，鼠标悬停，单击和上下文菜单事件。我有两个解决方案。首先是将事件处理程序绑定到每个节点。第二个方法是仅将事件处理程序绑定到根节点。当事件冒泡到根节点时，将调用处理程序。

问题2：这两种解决方案哪个性能更好？

Answer 1

CSS在悬停方面通常会胜过JavaScript，它更加原生，并且易于维护（性能不仅限于客户端技术，人工维护代码的性能如何？）。

为了在较旧的浏览器中提供支持，有时有必要在JavaScript中模拟悬停效果，具体取决于所使用的HTML（如果在链接上使用:hover，则总是可以的。

事件冒泡将比多个事件处理程序实例执行得更好。 http://icant.co.uk/sandbox/eventdelegation/

您绝对不应该使用悬停来扩展/折叠新内容，但是，这是不可访问的，应该始终通过链接元素上的click事件触发扩展/折叠（顺便说一句，听起来不像您。） >