我有一个巨大的jQuery应用程序,我正在使用下面的两个方法来处理点击事件。

第一个方法

HTML

<div id="myDiv">Some Content</div>

jQuery

$('#myDiv').click(function(){
    //Some code
});

第二种方法

HTML

<div id="myDiv" onClick="divFunction()">Some Content</div>

JavaScript函数调用

function divFunction(){
    //Some code
}

在我的应用程序中,我使用第一种或第二种方法。哪个更好?性能更好?和标准?


当前回答

第一种方法是选择。它使用高级事件注册模型,这意味着您可以将多个处理程序附加到同一个元素。您可以轻松地访问事件对象,并且处理程序可以存在于任何函数的作用域中。此外,它是动态的,即它可以在任何时候被调用,特别适合于动态生成的元素。无论直接使用jQuery、其他库还是本地方法都无关紧要。

第二种方法使用内联属性,需要大量全局函数(这会导致名称空间污染),并将内容/结构(HTML)与行为(JavaScript)混合在一起。不要用这个。

你关于性能或标准的问题不容易回答。这两种方法完全不同,做的事情也不一样。第一种更强大,而第二种则被鄙视(被认为是糟糕的风格)。

其他回答

这样做,因为它将为您提供标准和性能。

 $('#myDiv').click(function(){
      //Some code
 });

因为第二种方法是简单的JavaScript代码,比jQuery更快。但这里的性能大致相同。

恕我直言,onclick是优于.click的首选方法,仅当满足以下条件时:

页面上有很多元素 要为单击事件注册的事件只有一个 你担心手机性能/电池寿命

I formed this opinion because of the fact that the JavaScript engines on mobile devices are 4 to 7 times slower than their desktop counterparts which were made in the same generation. I hate it when I visit a site on my mobile device and receive jittery scrolling because the jQuery is binding all of the events at the expense of my user experience and battery life. Another recent supporting factor, although this should only be a concern with government agencies ;) , we had IE7 pop-up with a message box stating that JavaScript process is taking to long...wait or cancel process. This happened every time there were a lot of elements to bind to via jQuery.

$ (" # myDiv”)。click更好,因为它将JavaScript代码从HTML中分离出来。必须尽量保持页面行为和结构的不同。这很有帮助。

两者都不是更好的,因为它们可以用于不同的目的。onClick(实际上应该是onClick)执行得稍微好一点,但我高度怀疑你会注意到其中的差异。

值得注意的是,它们做不同的事情:.click可以绑定到任何jQuery集合,而onclick必须内联使用在你想要它绑定的元素上。您也可以使用onclick只绑定一个事件,而.click允许您继续绑定事件。

在我看来,我会保持一致,在任何地方都使用.click,并将所有JavaScript代码放在一起,与HTML分开。

不要使用onclick。除非你知道你在做什么,否则没有任何理由使用它,而你可能不知道。

大多数情况下,当性能是唯一的标准时,原生JavaScript方法是比jQuery更好的选择,但是jQuery利用了JavaScript并使开发变得容易。可以使用jQuery,因为它不会严重降低性能。在你的具体情况下,性能的差异是可以忽略的。