Shulou(Shulou.com)06/02 Report--

This article is to share with you about how to use the jQuery plug-in jQuery Templates, the editor thinks it is very practical, so I share it with you to learn. I hope you can get something after reading this article.

We know that Microsoft has already started to fully support jQuery, and has added jQuery by default in the MVC project, which is a boon to our Asp.net developers. Currently, Microsoft has developed three jQuery plug-ins for jQuery, namely jQuery Glob, jQuery Templates and jQuery Data Linking. Considering that domestic developers have very few users, I won't introduce them. Let's take a look at jQuery first. Templates:

JQuery Templates allows developers to easily bind javascript objects to html without requiring us to bind data mechanically from a text box to a text box. JQuery Templates supports simple syntax so that we can get the desired html results, using the jQuery Templates method as follows:

First, we need to reference the jQuery file and the jQuery.tmpl file, as follows:

Using jQuery Templates, we should embed what we want to display in the tag. Let's take a very simple example to look at how to use jQuery Templates:

UserName: {{= name}} Website: {{= website}}

We can use Template to display javascript objects or an array of javascript objects. Here is the array of javascript objects and jQuery methods that we will use to display:

Var users = [{name: "friend's you", website: "http://www.jquery001.com"}, {name:" jQuery Learning ", website:" http://www.jquery001.com"}]; $(document) .ready (function () {$("# usertemplate") .render (users) .appendTo ("# userinfo");})

The render () method converts the data into a string, and * appends the data to the userinfo element. After the page is loaded, the execution result is as follows:

As mentioned earlier, simple syntax can be used in jQuery Templates so that we can display the data as needed. For example, in this example, if someone has multiple websites, let's take a look at the simple if and each methods. The array of javascript objects is as follows:

Var users = [{name: "friend's you", websites: ["jquery001.com", "google.com"]}, {name: "jQuery Learning", websites: ["jquery001.com"]}, {name: "jQuery", websites: []}]

The following shows the use of the if and each methods in Template, and there is not much to say, and our users write down its syntax after using it once or twice:

UserName: {{= name}} {{if websites.length}} Websites: {{each websites}} {{= website}} {{/ each}} {{/ if}}

The following figure shows the results of * *, which you may have expected. Of course, this article is only a very simple introduction to the basic use of jQuery Templates, hoping to help readers.

The above is how to use the jQuery plug-in jQuery Templates. The editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.