【JavaScript】按鈕綁定點選事件-onCliek事件

<button type="submit" id="btn">btn</button>
           

1. 第一種:

$("#btn").click(function(event){}
           

2. 第二種:

document.getElementById('#foo').addEventListener('click', function(){});
           

3. 第三種:

3.1 html代碼：

<button type="submit" id="btn" onclick="btn()">btn</button>
           

3.2 js代碼：

function btn(){}
           

4. 第四種:

$('#btn').bind('click', function();
           

5.第五種:

$("btn").on("click",function(){});
           

結論：

1. 第一種和第二種的效果是一樣，可以附加多個事件處理函數，并不是隻有使用jquery才能做到。
2. 第三種方法不推薦使用，原則上HTML代碼隻能展現網頁的結構，具體的行為應該使用javascript代碼進行綁定。
3. 除非頁面上綁定事件的元素超過上萬個，否則響應速度的時候就不必糾結了，隻做個事件綁定還是很快的。我測試了一下，使用addEventListener綁定3000次，耗時3-4毫秒。
4. 如果項目中統一使用jQuery的話，建議使用第一種做法，順便還解決了IE的不相容問題。