¿Cuál es la mejor forma de ejecutar una función cuando el usuario hace clic en un enlace?

Question

Desde mi experiencia sé tres maneras diferentes para ejecutar una función de JavaScript cuando un usuario hace clic en un enlace

1. utilizar el atributo onclick en el enlace

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

2. Uso del href en el enlace

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

3. No toque el enlace, haga todo lo posible en js

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

   (Javascript en el que se detendrá el evento predeterminado, y llamar a la función)

cuál es mejor? ¿Cuáles son las ventajas y desventajas?

EDITAR elimina el "javascript:" en onclick

Answer 1

Unobtrusive Javascript (su tercer ejemplo) con graceful degredation es la mejor opción.

Answer 2

O, alternativamente, usar jQuery

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

Answer 3

Siempre es bueno tener un enlace en el atributo href con el fin de apoyar a los usuarios que tienen JavaScript desactivado en su navegador.

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

Answer 4

Ninguno de los de arriba. Usar la click evento (asignado ya sea como un atributo o vía la escritura si se prefiere) y tienen una URL real como un retorno:

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

o HTML:

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

Guión:

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

Además, no prefijo el código en los atributos del controlador de eventos con javascript:. Es incorrecto y solo no arroja un error por coincidencia (que es que en JavaScript, javascript: crea una etiqueta llamada javascript).