suceso de unión - jQuery vs Javascript

Question

¿Cuáles son las diferencias entre el uso

$("#element").click(function() { alert("test"); }); 

y

<div id="element" onclick="alert('test');"></div> 

¿Hay alguna diferencia en el rendimiento, la funcionalidad o cualquier otra cosa? ¿Debo utilizar el jQuery way, cuando puedo simplemente usar un atributo onclick?

Answer 1

Why Inline JavaScript Code Is Such A Bad Thing

y

Unobtrusive JavaScript

También es siempre mejor utilizar un marco para los eventos de JavaScript vinculante, ya que hay cosas entre navegadores que necesita para cuidar de sí mismo si no' t (attachEvent ..).

Answer 2

utiliza de click (así como la mayoría de las abstracciones de eventos los de otras bibliotecas) jQuery estándar DOM L2 addEventListener o MSHTML de propiedad (y más tarde copiado por otros navegadores, como Opera) attachEvent, cuando addEventListener no está disponible.

Si ni addEventListener, ni attachEvent están presentes (como es el caso con algunos de los antiguos navegadores), jQuery no hace nada (a partir de 1.4a2).

onclick="..." de su segundo ejemplo es lo que se llama intrinsic event attribute, y se define en HTML 4.01. El valor de dicho atributo de evento se convierte en un cuerpo de función de un controlador de eventos. Cuando se produce un evento, esta función del manejador se invoca con event como primer argumento; la cadena del alcance de la función también es usually augmented para incluir algunos de los antecesores y elementos del elemento en sí.

Los beneficios de atributo de evento intrínseco es el apoyo más amplio navegador y podría decirse que mejor rendimiento. Recuerdo haber visto pruebas de atributos de eventos que resultaban en un consumo de memoria mucho menor, en comparación con aquellos inicializados a través de addEventListener/attachEvent. No puedo encontrar esas pruebas en este momento.

Al evitar attachEvent, también evita fugas de memoria en IE, naturalmente. La mayoría de las bibliotecas de JavaScript populares realmente crean referencias circulares en sus abstracciones de eventos, y luego se ven obligadas a realizar una limpieza en la descarga de la página en IE. Obviamente, estos problemas desaparecen cuando se evitan las abstracciones de eventos que se basan en attachEvent.

Las desventajas de atributos de evento, sin embargo, es la falta de capacidad de reutilización , separación ruptura de las preocupaciones y contaminación marcado (que afecta a ambos - el tamaño del documento, y su capacidad de mantenimiento). Recuerde que la lógica del atributo de evento se transfiere constantemente a un cliente, en lugar de ser parte de un script externo que se descarga una vez y se almacena en caché. También existe la posibilidad de ser disparado en un ámbito aumentado.

Recomendaría a evitar los atributos del evento, a menos que sea absolutamente necesario.