JQuery. tmpl () usage example _ jquery

With the Smarty templates, JavaScript can also use the templates to solve PHP Data splicing problems, such as jQuery-based jquery. tmpl dynamic request data to update pages is now a very common method, such as dynamic loading of blog comments by PAGE, rolling loading of Weibo, and loading of scheduled requests.

In these cases, the data returned by the dynamic request is generally not formatted as JSON or XML. In short, data is spelled out on the server rather than on the browser. However, from the perspective of the transmission volume, it is not cost-effective to return HTML. In terms of web transmission, JSON rather than XML is used.

The browser generates HTML based on JSON. It is annoying that when the structure is not complex, the structure is complicated and the browser wants to die, you need to carefully write JavaScript code that is barely maintained.

For example, with the Smarty templates used to solve the PHP Data spelling problem, JavaScript can also use the templates to solve these problems, such as jQuery-based jquery. tmpl, now accepted as the official template plug-in. The detailed API is in the Templates of jQuery. the built-in demo also demonstrates various usage.

I have used it several times, and I feel very good. I wrote the structure in HTML rather than JavaScript, and then filled the data with JSON variables, the code looks much better.

Tmpl provides several tags:

$ {}: Equivalent to {{=}}. It is an output variable encoded in html.
{Html}: output variable html, but no html encoding, suitable for output html code.
{If }{{ else }}: provides the branch logic.
{Each}: provides loop logic and $ value is used to access iteration variables.

How to Use jquery tmpl:

Template definition:

Method 1: