Ввод OnClick обработчиков тегов в сравнении с JS кодом

Question

Скажем, у меня есть две кнопки, как это:

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

Что бы разница, кроме того, код отличается, положить атрибут onclick на одном из них , и используя jQuery для обработки другого?

HTML:

<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

Они выполняют ту же самую вещь, но есть некоторые отличия:

• Связывание событий в HTML существует, когда элемент создан, а событие, связанное с jQuery, добавляется несколько позже, когда документ завершен а также инициируется событие ready.

• События jQuery являются многоадресными, то есть вы можете связывать несколько событий одного и того же типа с одним и тем же элементом.

Answer 2

По сути, нет никакой разницы в функциональности двух элементов управления - они оба будут выполнять ту же команду.

Однако, если структура была правильно структурирована, ваш сайт должен загружать любые внешние скрипты (например, со вторым примером) для последней страницы, чтобы уменьшить время загрузки.

В основном, хотя разница будет незаметна с малого веб-страницы, первый пример вызовет вызов функции должен быть загружен в то время как страница генерируется, в то время как второй должен быть загружен после того, как страница была закончена загрузка - это означает немного меньше времени для загрузки фактической страницы.

EDIT:

Однако при дальнейших исследованиях, кажется, современные браузеры более способны обрабатывать этот процесс, см: Where should I put <script> tags in HTML markup?

Answer 3

Хорошо, эффект такой же. Однако есть некоторые отличия, такие как: В то время как первое событие является триггером при нажатии первой кнопки, содержимое загружается после загрузки страницы, второе запускается, конечно, после нажатия, но содержимое инициализируется каждый момент ,