用JSON数据填充静态HTML页面

Question

I am looking for a good template library that will allow me to fill in a static HTML page with a few variables that will be in JSON format - using javascript. There will only be a few variables that change and one might be in <title></title>

Ideally I'm looking for something like:

<div>
    Name: {name} is currently {age} years old
</div>

and then simply being able to supply the values for name and age via JSON and having it populated with values on the fly.

Does anyone know of a library that would work well?

Thanks in advance.

Answer 1

Handlebars.js is fairly simple to use

<div class="entry">
  <h1>{{title}}</h1>
  <div class="body">
    {{body}}
  </div>
</div>

Check out their docs

Answer 2

Why noy just use jQuery?

http://jsfiddle.net/chace/NF496/7/

var someJSONName = "Jimmy"
var someJSONAge = "32"

$("#myContent").click(function () {
    $("#myContent").effect("highlight", 1500);
    $("#myContent").text("Name: " + someJSONName + " is currently " + someJSONAge + " years old.");
});

Answer 3

Take a look at AngularJS too. Especially optimal if you're working with large datasets that can change over the lifetime of the page.

Docs: http://angularjs.org/