J'apprends actuellement JQuery en lisant JQuery en action.
Le livre discute de la séparation des préoccupations en utilisant "JavaScript discret". Je grok que le comportement qui garde le comportement spécifié par JavaScript sorti de l'arbre Cependant, les avantages de l'utilisation de cette approche semblent être annulés lors de la recherche de la génération HTML dynamique avec jQuery, tels que cet exemple: p> ici, nous mélangeons la structure (le nouveau est mon compréhension correcte? Quelles sont les meilleures pratiques pour atténuer cela? Est-il courant de faire référence à des ressources externes et an .js lors de ce type de génération HTML dans la pratique? P> P> $('<img>',
{
src: 'images/little.bear.png',
alt: 'Little Bear',
title:'I woof in your general direction',
click: function(){
alert($(this).attr('title'));
}
})
.css({
cursor: 'pointer',
border: '1px solid black',
padding: '12px 12px 20px 12px',
backgroundColor: 'white'
})
.appendTo('body');
code> élément), style (avec l'appel à CSS ()) et le comportement (en définissant la valeur de l'attribut Cliquez .) Donc, nous n'avons plus de séparation des préoccupations, même si ce bloc est placé dans le
5 Réponses :
Meilleure pratique consiste à utiliser un moteur de modèles (comme Mustache.js ou JQuery's est construit Moteur de modèles ) et classes, via . AddClass .
Mais à la fin, vous ne pouvez tout simplement pas séparer complètement le V du c (vue de contrôleur - MVC ), en particulier en HTML.
Lien vers "Moteur de modèles" est mort ( 404 - page non trouvé ).
Je pense que la meilleure pratique serait d'utiliser des classes dans JQuery et de garder votre CSS dans une feuille de style distincte.
J'ajouterais aussi que l'apprentissage directement de la bouche du cheval travaille pour moi. J'utilise http://api.jquery.com/ pour presque tout ce dont j'ai vraiment besoin de comprendre jQuery. < / p>
Pourriez-vous décrire rapidement les classes de jQuery? Vous parlez de classes CSS? Sinon, apparemment, je n'ai pas compris cela.
@redtrodrone - Bien sûr. Comme Zirak a déclaré, .AddClass () est un. .TOGgleclass () et
@retrodrone - En outre, HTML5BOILERPLET est incroyable d'apprendre les meilleures pratiques. Paul Irish et ses copains ont fait un kit de démarrage avec les 2 ou 3 dernières années de meilleures pratiques. Il utilise également modernizr , qui utilise à son tour
@retrodrone - et pour répondre à votre deuxième question plus précisément, oui classes CSS. Au lieu d'utiliser $ ("# id"). CSS ({"largeur": "100px"}); vous souhaitez utiliser $ ("# ID"). Addclass (" myclass "); où dans votre style externe, vous avez eu un .MyClass {largeur: 100px; } .
Votre manque du point ici.
avec JavaScript discret L'objectif principal est que, si JavaScript ne parvient pas à charger ou à exécuter, comment votre application va-t-elle répondre? C'est la chose essentielle car les gens ont désactivé JavaScript dans de nombreuses pages, votre candidature aura-t-elle montré tout contenu et réagir de manière normale ou irait à mort?
Vous ne pouvez pas vraiment séparer la vue du contrôleur, mais javascript sans obstruction aide dans cette direction. Mais le véritable avantage est la résilience.
Également si vous voulez une bonne abstraction, utilisez knockoutjs . Je ne peux pas vraiment mettre l'accent sur moins et je ne peux pas imaginer créer d'énormes sites Web avec un excellent code côté client sans une bibliothèque similaire.
Wow, ouais, j'ai complètement manqué ça. Génial sur knockoutjs, merci! Je me demandais comment appliquer MVVM dans Web Terre!
La grande image de la séparation HTML, CSS et JS est que vous souhaitez que votre site soit utilisable (et navigable) si CSS et JS ne sont pas disponibles.
Par exemple, si votre site dépend de JS pour charger du contenu - sans aucune sorte de "repli" - il est cassé pour quiconque n'a pas activé JS.
Il est parfaitement possible d'avoir un site complet qui utilise tous les avantages de CSS et de JS, mais de les amener à travailler ensemble afin que le site échoue gracieusement si votre CSS ou JS ne soit pas chargé, est un objectif qui mérite d'être atteint. .
Parler de mon expérience avec JQuery Séparation est le meilleur moyen de conserver le code de maintenabilité et de conserver la conception, le contenu et la fonctionnalité séparez.
Markup strong> P> référence à votre exemple - Dans la plupart des cas, le balisage est livré avec votre fichier HTML ou est demandé par les appels AJAX. p> CSS strong> p> Les fonctionnalités CSS de JQuery sont principalement utilisées en cas de manipulation de l'envoi , les propriétés CSS originales sont toujours venues via des fichiers CSS. P> événements forts> p> Généralement, vous maintenez une "section bind" dans votre script, où vous définissez tout Vos événements BIND / LIVE: P> $( '.clickable' ).live('click', function(){
// do something if clicked ...
});
En outre, quelle est la bonne façon de citer des exemples de code à partir de ceci sur Stackoverflow? C'est la liste 2.1 dans "JQuery in Action, 2e édition".
Supposez le code (et tout ce que vous avez copié VERBATIM) dans un bloc de devis et mentionnez / associez à la source.