1 <html> 2 <head><title>Jstemplates: Quick example</title> 3 <script src="../util.js" type="text/javascript"></script> 4 <script src="../jsevalcontext.js" type="text/javascript"></script> 5 <script src="../jstemplate.js" type="text/javascript"></script> 6 <script type="text/javascript"> 7 8 var tplData = {username:"Jane User", 9 addresses:[ 10 {location:"111 8th Av.", label:"NYC front door"}, 11 {location:"76 9th Av.", label:"NYC back door"}, 12 {location:"Mountain View", label:"Mothership"} 13 ] 14 }; 15 16 function showData() { 17 // This is the javascript code that processes the template: 18 var input = new JsEvalContext(tplData); 19 var output = document.getElementById('tpl'); 20 jstProcess(input, output); 21 } 22 </script> 23 </head> 24 <body onload="showData()"> 25 26 <!-- 27 This is the template: 28 --> 29 30 <div id="tpl"> 31 <h1> 32 <span jsselect="username" jscontent="$this">User de Fault</span>'s 33 Address Book 34 </h1> 35 <table cellpadding="5"> 36 <tr><td><h2>Location:</h2></td><td><h2>Label:</h2></td></tr> 37 <tr jsselect="addresses"><td jscontent="location"></td><td jscontent="label"></td></tr> 38 </table> 39 </div> 40 41 </body> 42 </html> 43
