"click target" 或 "DOM matches" 哪个执行得更快

Question

我在这里尝试使用#missingRecord select parent div。保持 CPU 低的性能更好 :D

点击目标：

 if ( $(e.target).parents("#missingRecord").length) { 

        }

Dom 匹配

if($(this).closest().attr("id") == "missingRecord") {



}

Answer 1

我告诉你，e.target 和 this 并不总是代表同一个对象。

而且我认为 e.target 和 this 不会有任何性能差异。由于访问变量是非常非常低计算操作（尽管这取决于变量的大小）

让我告诉你 $(this) 和 event.target 之间的区别，而且非常重要。虽然 this（或 event.currentTarget，见下文）始终指的是侦听器附加到的 DOM 元素，但 event.target 是实际被单击的 DOM 元素.请记住，由于事件冒泡，如果你有

<div class="outer">
  <div class="inner"></div>
</div>

并将点击监听器附加到外部 div

$('.outer').click( handler );

然后当您在外部 div 和内部单击时将调用 handler（除非您有其他代码处理内部 div 上的事件并停止传播）。

在这种情况下，在 handler、this（和 event.currentTarget）中将引用 .outer DOM 元素，并且 event.target 将引用 .inner 元素。

jQuery 包装器 $(this) 仅将 DOM 元素包装在 jQuery 对象中，因此您可以在其上调用 jQuery 函数。你可以用 $(event.target).

做同样的事情

另请注意，如果您重新绑定 this 的上下文（例如，如果您使用 Backbone，它会自动完成），它将指向其他内容。您始终可以从 event.currentTarget.

中获取实际的 DOM 元素

Source

"click target" 或 "DOM matches" 哪个执行得更快

Simply which perform faster "click target" or "DOM matches"

performance

jquery

dom

click