¿Cómo usar el motor de plantillas micro JavaScript John Resig?

He buscado un poco sobre un ejemplo básico sobre el uso del motor John Resig JavaScript Micro-Templating en Google pero salió seco.¿Cómo usar el motor de plantillas micro JavaScript John Resig?

Decidí llevarlo a la base chicos. ¿Alguien puede ayudar con un simple ejemplo sobre el uso de este motor? Nunca antes había usado un motor de plantilla del lado del cliente.

Actualización: este es el documento HTML completo. Gracias a Will.

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>John Resig JavaScript Micro-Templating engine</title> 
    <script src="jquery-1.3.2.js" type="text/javascript"></script> 
    <script src="MicroTemplates.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     //Data 
     var data = { fname: "fred" }; 

     function onloadFunction() { 
      var s = $("#biodata").html(); 
      var s1 = tmpl(s, data); 

      $("#target").html(s1); 
     } 
    </script> 
    <script id="biodata" type="text/html"> 
     <div><%= fname %></div> 
    </script> 
</head> 
<body onload="onloadFunction();"> 
    <div id="target"> 
    </div> 
</body> 
</html>

Fuente

2009-11-21 Tebo

Gracias por el cambio. Greg. – Tebo

Sería bueno si pudieras proporcionar un enlace a un Fiddle. – ayjay

El enlace que proporcionó tiene un ejemplo inmediatamente después del código del motor. Lee del 2do párrafo abajo.

CB, usando su ejemplo, aquí está mi opinión sobre el motor, que emite el valor de fname entre las etiquetas div. Para llevar a cabo la generación, haría algo como:

var data = { fname : "fred" }; 
var generatedText = tmpl("biodata", data);

Luego tendría que enviarlo, por ej.

document.write(generatedText);

O (suponiendo un div existe en la página con el id de 'elemId')

var elem = document.getElementById("elemId"); 
elem.innerHTML = generatedText;

Todo lo anterior no se ha probado, pero es de esperar precisa. ¡Espero eso ayude!

Fuente

2009-11-21 10:10:49 Will

Excelente, ¡mi primera respuesta aceptada! ¡Me alegro de haber sido de ayuda! =) – Will

¿Cómo usar el motor de plantillas micro JavaScript John Resig?

Respuesta

Cuestiones relacionadas