Каков наилучший способ выполнения функции, когда пользователь нажимает на ссылку?

Question

Из своего опыта я знаю три различных способа выполнения функции Javascript, когда пользователь нажимает на ссылку

1. Используйте атрибут onclick в ссылке

   <a href="#" onclick="myfunction();return false;">click me</a>
   

2. Используйте href по ссылке

   <a href="javascript:myfunction();">click me</a>
   

3. Не трогайте ссылку, делайте все в js

   <a href="#">click me</a>
   

   (в Javascript мы остановим событие по умолчанию и вызовем функцию)

Какой из них лучше? Каковы преимущества и недостатки?

РЕДАКТИРОВАТЬ удалил "javascript:" на onclick

Answer 1

Ненавязчивый Javascript (ваш третий пример) с изящной деградацией - лучший выбор.

Answer 2

Всегда полезно иметь ссылку в атрибуте href, чтобы поддерживать пользователей, которые отключили JavaScript в своих браузерах.

<a href="http://www.mywebsite.com/javascriptdisabled.html" onclick="myfunction(); return false;">click me</a>

Answer 3

Ничего из вышеперечисленного. Используйте событие click (назначенное в качестве атрибута или через сценарий, если хотите) и используйте реальный URL в качестве запасного варианта:

<a href="realpage.html" onclick="myfunction(); return false;">click me</a>

или HTML:

<a href="realpage.html" id="myLink">click me</a>

Сценарий:

document.getElementById("myLink").onclick = function() {
    myfunction();
    return false;
};

Кроме того, не добавляйте префикс кода в атрибуты обработчика событий к javascript:. Это неверно и только не выдает ошибку по совпадению (то есть в JavaScript javascript: создает метку с именем javascript).

Answer 4

Или, альтернативно, используйте jQuery

$(function() {
    $('[id$=myLinkID]').click(function(e) {
        myFunction();
    });
});