javascript - inner - Jquery Malas prácticas

wrap inner

Question

¿Cuáles son las prácticas malas / peores de JQuery que has visto, escrito o algo que deben evitarse?

Answer 1

Hay dos que veo mucho:

Primero , en un evento de clic, se accede a la id esta manera:

$("a").click(function(e){
   var id = $(this).attr(''id'');
});

Eso crea un nuevo objeto jQuery alrededor del nodo DOM y llama a una función. La siguiente es la forma correcta:

$("a").click(function(e){
   var id = this.id;
});

Nota: También verá $(this).attr(''href'') , pero eso es correcto debido a la forma en que jQuery lo normaliza en los navegadores.

El segundo es pasar cualquier cosa excepto un nodo DOM al parámetro de scope de la llamada jQuery:

$(".child", $(".parent")).doSomething();
// or
$(".child", ".parent").doSomething();

No hay ganancia de velocidad en absoluto haciendo esto. Cuando ve un aumento de velocidad, es cuando ya tiene el elemento DOM:

$(''div'').click(function(){
   $(''img'', this).doSomething(); // This is good
});

Answer 2

James Padolsey ha escrito un excelente artículo sobre los olores del código jQuery. Recomiendo leerlo.

Answer 3

Todavía usando la función de documento antiguo listo:

$("document").ready(function(){ });

En lugar de lo muy común:

$(function(){ });

No es realmente malo, pero les muestro a las personas que no se levantan con las nuevas API.

Answer 4

Una cosa que debe evitar es usar los selectores "fáciles de usar" en cada línea una vez más, porque la implementación de JavaScript de los selectores no es tan eficiente. Por supuesto, los chicos de jQUery lo están optimizando, sin embargo, creo que deberías usarlo lo menos posible.

Entonces, esta es una mala práctica.

$("li ul span").show();
$("li ul span").toggleClass("bubu");

El encadenamiento es bueno

$("li ul span").show().toggleClass("bubu");

Y recordar cosas en una variable local tampoco es malo:

var allspans = $("li ul span");
allspans.show();
allspans.toggleClass("bubu");