我有一个巨大的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
}

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


当前回答

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

其他回答

<whatever onclick="doStuff();" onmouseover="in()" onmouseout="out()" />

onclick, onmouseover, onmouseout等事件实际上对性能不好(主要是在ie中,去想想)。如果您使用Visual Studio进行编码,当您使用这些代码运行一个页面时,其中的每一个都将创建一个单独的SCRIPT块,占用内存,从而降低性能。

更不用说你应该有一个分离的关注点:JavaScript和布局应该分开!

为这些事件创建evenHandlers总是更好的,一个事件可以捕获数百/数千个项目,而不是为每个事件创建数千个单独的脚本块!

(还有,所有人都在说的话。)

不同的作品。如果使用click(),则可以添加几个函数,但如果使用属性,则只执行一个函数—最后一个函数。

DEMO

HTML

<span id="JQueryClick">Click #JQuery</span> </br>
<span id="JQueryAttrClick">Click #Attr</span> </br>

JavaScript

$('#JQueryClick').click(function(){alert('1')})
$('#JQueryClick').click(function(){alert('2')})

$('#JQueryAttrClick').attr('onClick'," alert('1')" ) //This doesn't work
$('#JQueryAttrClick').attr('onClick'," alert('2')" )

如果我们谈论的是性能,在任何情况下直接使用总是更快,但使用属性,您将只能分配一个函数。

使用onclick的第一种方法不是jQuery,而是简单的Javascript,所以您没有jQuery的开销。jQuery的方式可以通过选择器进行扩展,如果你需要将它添加到其他元素,而不需要为每个元素添加事件处理程序,但现在你有了它,是否需要使用jQuery只是一个问题。

就我个人而言,因为你正在使用jQuery,我会坚持使用它,因为它是一致的,并从脚本中解耦标记。

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

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