Conseils et astuces jQuery

Question

La syntaxe

• Abréviation pour le prêt-à-événement par roosteronacid
• Les sauts de ligne et la possibilité d'enchainement par roosteronacid
• L'imbrication de filtres de Nathan Long
• Cache une collection et d'exécuter des commandes sur la même ligne par roosteronacid
• Contient sélecteur par roosteronacid
• Définition des propriétés de l'élément de la création par roosteronacid
• Accéder à des fonctions jQuery comme vous le feriez d'un tableau par roosteronacid
• Le noConflict la fonction de libération de la variable $ par Oli
• Isoler la variable $ en mode noConflict par nickf
• Absence de conflit mode par roosteronacid

Le Stockage De Données

• Les données de la fonction de lier des données à des éléments par TenebrousX
• HTML5 attributs de données de soutien, sur les stéroïdes! par roosteronacid
• Le jQuery métadonnées plug-in par Filip Dupanović

Optimisation

• Optimiser les performances de complexe sélecteurs par roosteronacid
• Le paramètre de contexte par lupefiasco
• D'enregistrer et de réutiliser des recherches par Nathan Long
• La création d'un Élément HTML et garder une référence, Vérifier si un élément existe, l'Écriture de vos propres sélecteurs par Andreas Grech

Divers

• Vérifier l'indice d'un élément dans une collection par redsquare
• En direct des gestionnaires d'événements par TM
• Remplacer les fonctions anonymes avec des fonctions nommées par ken
• Microsoft framework AJAX et jQuery pont par Slace
• tutos jQuery par egyamado
• Supprimer des éléments d'une collection et de préserver la possibilité d'enchainement par roosteronacid
• Déclarer $au début des fonctions anonymes, par Ben
• FireBug lite, Hotbox plug-in, dire lorsqu'une image a été chargée et Google CA par de la Couleur de Mélange
• L'utilisation judicieuse de la troisième partie de scripts jQuery par harriyott
• La fonction de chaque par Jan Zich
• Forme Extensions plug-in par Chris S
• Asynchrone chaque fonction par OneNerd
• Le jQuery modèle de plug-in: la mise en œuvre de la logique complexe à l'aide de rendu des fonctions par roosteronacid

Answer 1

Création d’un HTML élément et de garder une référence

Vérifier si un élément existe

Écrire vos propres sélecteurs

Answer 2

La méthode data() jQuery est utile et mal connue. Il vous permet de lier des données aux éléments DOM sans modifier le DOM.

Answer 3

Filtres d'imbrication

Vous pouvez imbriquer des filtres (comme nickf montré ici ).

 .filter(":not(:has(.selected))")
 

Answer 4

Je ne suis vraiment pas un fan de l' $(document).ready(fn) de raccourci. Assurez-vous qu'elle coupe vers le bas sur le code, mais il réduit également les chemin vers le bas sur la lisibilité du code. Quand vous voyez $(document).ready(...), vous savez ce que vous cherchez. $(...) est utilisé dans de trop nombreuses autres façons de faire sens.

Si vous disposez de plusieurs cadres, vous pouvez utiliser jQuery.noConflict(); comme vous le dites, mais vous pouvez également affecter une variable, comme ceci:

var $j = jQuery.noConflict();

$j("#myDiv").hide();

Très utile si vous avez plusieurs cadres de qui peut être cuit à l' $x(...)-style appels.

Answer 5

Ooooh, n'oublions pas les métadonnées jQuery ! La fonction data () est géniale, mais elle doit être remplie via les appels jQuery.

Au lieu de rompre la conformité W3C avec les attributs d'éléments personnalisés tels que:

 <input 
  name="email" 
  validation="required" 
  validate="email" 
  minLength="7" 
  maxLength="30"/> 
 

Utilisez des métadonnées à la place:

 <input 
  name="email" 
  class="validation {validate: email, minLength: 2, maxLength: 50}" />

<script>
    jQuery('*[class=validation]').each(function () {
        var metadata = $(this).metadata();
        // etc.
    });
</script>