La ventaja de esta * * sobre event.target

¿Es mejor/más rápido dentro de un detector de eventos para utilizar this o event.targetLa ventaja de esta * * sobre event.target

He estado escribiendo código como este (ejemplo es jQuery):

jQuery('input').bind('keyup', function (e) { 
var j = jQuery(e.target); 
foo(j.attr('id') , j.val()); 
});

Y me dijeron que debía reemplazar e.target con this porque es "mejor". ¿Hay alguna ventaja para uno u otro?

Uso el objetivo porque es una solución más general ya que funciona para eventos delegados. Tengo problemas para la evaluación comparativa porque mis pruebas ponen desordenado con la unión (Aunque, obviamente, en este caso, la diferencia sería demasiado pequeño a la materia de todos modos)

Fuente

2012-07-03 ColBeseder

Usando delegar, 'this' devuelve el elemento que coincide con el selector. 'target' devuelve el elemento del que salió el evento. – ColBeseder

'this' es más rápido en este caso: http://jsperf.com/this-and-event-target – Mageek

esto sería un poco más rápido ya que no tiene que resolver' property of object'. Pero eso es tan marginal que ni siquiera vale la pena discutirlo. Si lo está buscando por motivos de rendimiento, primero eche un vistazo a 'this.id' sobre' j.attr ('id') '. (Corto: ¡en realidad no importa!) – rodneyrehm

El uno no es mejor que el otro, pero que hacen cosas diferentes: se refiere el presente al elemento al que está asociado el evento, mientras que event.target es el elemento que invocó el evento.

Por ejemplo

div id=foo 
    div id=bar

cuando clic se une a foo, y se hace clic en la barra, el evento se suben a foo. En el caso de este se referirá a foo y event.target a barra

Al final, depende de qué elemento que necesita para manejar.

Hay un pequeño ejemplo en api.jquery.com/event.target que ilustra event.target. Aquí hay una pequeña muestra que usa ese ejemplo, pero que también muestra este: http://jsbin.com/adifan/edit#javascript,html,live

Fuente

2012-07-03 09:15:27

En eventos delegados, 'this' aún apunta a lo mismo que' event.target'. Por ejemplo '$ ('# foo').on ('click', '# bar', función (e) {..}); ' –

foo

'teniendo un clic en' p' haría que 'event.originalTarget' apuntara al' span 'si haces clic en la palabra' foo'. – rodneyrehm

@ GabyakaG.Petrioli En su ejemplo, enlaza el selector "#bar", no foo, por lo que * this * será barra. Si se une a #foo, * this * debería ser foo. He usado el ejemplo de http://api.jquery.com/event.target/ y he agregado la pantalla de * this * a la pantalla para ilustrar los dos en esta muestra: http://jsbin.com/adifan/editar # vista previa –

Bueno, la documentación de jQuery es claro al respecto :-)

La propiedad de destino puede ser el elemento que se registró para el evento o un descendiente del mismo. A menudo es útil comparar event.target con esto para determinar si el evento se está manejando debido al burbujeo del evento. Esta propiedad es muy útil en la delegación de eventos, cuando los eventos burbujean.

(Fuente: http://api.jquery.com/event.target/)

Este enlace explica el término "propagación de eventos": http://www.quirksmode.org/js/events_order.html

Fuente

2012-07-03 09:15:09 dmnkhhn

La ventaja de esta * * sobre event.target

Respuesta

Cuestiones relacionadas