Modèles jQuery recommandés pour 2012?
les modèles jQuery sont obsolètes depuis un certain temps.
J'ai des données sous la forme d'un objet JavaScript que je veux formater au format HTML et ajouter au DOM. Quelle est la meilleure façon de faire cela ces jours-ci?
- Devrais-je construire une chaîne HTML?
- Devrais-je créer des éléments via jQuery tels que
$('<li>',{id:'my-'+Id}).append($('<span>').text(myText))? - Existe-t-il un substitut ou un substitut mature aux modèles jQuery?
Voici comment je le fais dans mes projets:
Définissez un modèle dans votre code HTML:
<script type="text/template" id="cardTemplate">
<div>
<a href="{0}">{1}</a>
</div>
</script>
Utilisez string.format pour substituer des variables:
var cardTemplate = $("#cardTemplate").html();
var template = cardTemplate.format("http://example.com", "Link Title");
$("#container").append(template);
String.prototype.format = function() {
var args = arguments;
return this.replace(/{(\d+)}/g, function(match, number) {
return typeof args[number] != 'undefined'
? args[number]
: match
;
});
};
Assez simple, vous pouvez même combiner des modèles.
Moustache.js est très bon pour les templates.
Modèles tout le chemin, tellement plus facile que d'essayer d'analyser le JSON manuellement. Depuis que j'y contribue, je suis un partisan de json2html car il n’exige pas la compilation des modèles ET n’utilise que JSON et JavaScript.
Je n'aime pas vraiment construire des éléments html en javascript, je vous suggère donc d'utiliser un modèle.
Vous pouvez trouver une liste de modèles et une question connexe ici .
J'avais l'habitude d'utiliser jQuery Templates, c'est simple, mais ce n'est plus activement.