HTML：

Question

说我有两个按钮，如下：

<input type="button" id="button1" value="click me 1" />
<input type="button" id="button2" value="click me 2" />

除了代码不同之外，在其中一个上放置onclick属性，并使用jQuery处理另一个属性会有什么不同？

<input type="button" id="button1" value="click me 1" onclick="alert('Clicked button 1!');"/>
<input type="button" id="button2" value="click me 2" />

JS / jQuery的：

$(document).ready(function() {
    $("#button2").click(function(){
        alert("Clicked button 2!");
    }); 
});

Answer 1

效果是一样的。然而，有一些差异，如：当单击第一个按钮时触发第一个事件，在页面加载后加载内容，第二个事件被触发，当然在点击之后，内容每时每刻都被初始化。

Answer 2

基本上，两个控件的功能没有区别 - 它们都会执行相同的命令。

但是，如果结构正确，您的网站应该为页面最后加载任何外部脚本（例如第二个示例）以减少加载时间。

基本上，尽管使用小规模网页时差异不明显，但第一个示例将导致在生成页面时加载函数调用，而第二个应加载页面已完成加载 - 意味着加载实际页面的时间略少。

修改

然而，经过进一步研究，现代浏览器似乎更有能力处理此过程，请参阅：Where should I put <script> tags in HTML markup?

Answer 3

他们完成了同样的事情，但存在一些差异：