Nouveaux modèles jQuery recommandés ?

Question

Les modèles jQuery sont dépréciés depuis un certain temps déjà.

J'ai des données sous la forme d'un objet JavaScript que je veux formater en HTML et ajouter au DOM. Quelle est la meilleure façon de le faire aujourd'hui ?

1. Dois-je constituer une chaîne HTML ?
2. Dois-je créer des éléments via jQuery tels que $('<li>',{id:'my-'+Id}).append($('<span>').text(myText)) ?
3. Existe-t-il un remplacement ou un substitut mature pour les modèles jQuery ?

Answer 1

C'est ainsi que je procède dans mes projets :

Définissez un modèle dans votre HTML :

<script type="text/template" id="cardTemplate">
<div>
    <a href="{0}">{1}</a>
</div>
</script>

Utilisez string.format pour substituer les variables :

var cardTemplate = $("#cardTemplate").html();
var template = cardTemplate.format("http://example.com", "Link Title");
$("#container").append(template);

string.format :

String.prototype.format = function() {
  var args = arguments;
  return this.replace(/{(\d+)}/g, function(match, number) { 
    return typeof args[number] != 'undefined'
      ? args[number]
      : match
    ;
  });
};

Plutôt simple, vous pouvez même combiner les modèles.

Answer 2

Vous devriez vraiment essayer Guidon et/ou Moustache

J'ai tendance à utiliser Handlebars mais la syntaxe est assez similaire.

Answer 3

Mustache.js est assez bon pour la création de modèles.

https://github.com/janl/mustache.js

Answer 4

Les modèles sont toujours là, c'est tellement plus facile que d'essayer d'analyser manuellement le JSON. Comme j'y ai contribué, j'ai un faible pour json2html car il ne nécessite pas la compilation des modèles et n'utilise rien d'autre que JSON et JavaScript.

http://json2html.com

Answer 5

Je n'aime pas vraiment construire des éléments html en utilisant le javascript, donc je vous suggère d'utiliser un modèle.
Vous trouverez une liste de modèles et une question connexe. ici .

J'avais l'habitude d'utiliser jQuery Templates C'est assez simple mais ce n'est plus actif.