jQuery Standards and Best Practice

Question

Je suis actuellement responsable du déploiement de jQuery dans la communauté des développeurs Web de notre société. Une partie de ceci implique la présentation d'un cours, cependant une autre partie implique la communication des normes et des meilleures pratiques.

Si vous utilisez Google "jQuery", vous trouverez probablement ce qui suit parmi les résultats de recherche. http://www.smashingmagazine.com/2008/09/16/jquery-examples-and-best-practices/ http://www.artzstudio.com/2009/04/jquery-performance-rules/

Ces derniers ont été utiles et j'ai luisaient beaucoup d'informations utiles sur eux. Cependant, ce qui m'intéresserait vraiment, ce serait des conseils, des pièges, des opinions, etc., sur les meilleures pratiques des développeurs expérimentés de jQuery et ceux qui se seraient trouvés dans une position similaire à moi-même. Tous les bons liens seraient également appréciés.

EDIT:

Ajout d'une section Normes de codage jQuery sur ma propre page:

http://www.jameswiseman.com/blog/?p=48

Answer 1

Vous pouvez trouver ce trending topic ici dans StackOverflow.com

jQuery pitfalls to avoid

conseils utiles très intéressants l'un après l'autre.

voici plus je l'ai trouvé dans mes favoris:

• http://paulirish.com/2011/11-more-things-i-learned-from-the-jquery-source/
• http://jquery.open2space.com/
• http: //thetoptenme.wordpress.com/2008/08/19/le complet-guide-pour-jquery-développeur-reblog/
• http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

Answer 2

La façon dont fonctionne jQuery est pas la même façon que JavaScript fonctionne, même si elles sont un seul et même. jQuery fonctionne sur les sélecteurs CSS, comme le (s) nom (s) de classe et l'identifiant des éléments. Pour sélectionner un élément dans jQuery, vous:

$("#yourID") or $(".yourClass") or $("div") or $("#yourID p") etc 

Et vous obtiendrez une collection de tous les éléments sur la page qui correspondent à vos critères. Vous pouvez ensuite effectuer vos actions sur TOUS ces éléments sans aucune boucle. Il est important de se rappeler:

$(".yourClass").click(function(){ 
    //do stuff 
}); 

aura une incidence sur tous les éléments avec .yourClass qui leur sont rattachés. Une astuce: si vous allez accéder au $(this), vous devez enregistrer comme une variable locale:

$(".yourClass").click(function(){ 
    var $this = $(this); 
}); 

car il permettra d'accélérer votre fonction.

Answer 3

Quelque chose que j'ai personnellement commencé à faire est une sorte d'un Apps Hungarian Notation pour jQuery définit, en préfixant ces variables avec un $

var someInt = 1; 
var $someQueryCollection = $('selector'); 

Je trouve que mes extraits jQuery grandir, cela devient une valeur inestimable, non seulement dans la promotion du stockage jQuery définit comme variables, mais pour me aider à garder une trace des variables sont actuellement jeux jQuery.

Answer 4

JavaScript Unobtrusive (séparation de balisage et de comportement)

Retour dans les jours, il était courant de mettre votre gestionnaire de clic dans le balisage. Maintenant, il est recommandé de ne pas écrire votre code JS dans votre balisage mais de l'inclure via les événements DOM.

amélioration progressive

utilisateur obtient une meilleure expérience si elles utilisent navigateur conforme aux standards et/ou JavaScript est activé. Site Web/application web est toujours accessible même si elles ont un navigateur plus ancien ou JS désactivé.

La détection d'objets et non détection du navigateur

Garder les points ci-dessus mis à part, je voudrais vraiment mettre l'accent sur la transmission du message (rupture de la notion préconçue) que JavaScript est un langage de jouet. J'ai vu trop de développeurs qui pensent de cette façon et tout est en baisse à partir de là. Vous devez leur expliquer comment JavaScript est un langage très puissant et pourquoi ils ont besoin d'une bibliothèque JS (à cause des incohérences du navigateur) même si JS lui-même est très puissant.

Bonne chance.