Home Web Front-end JS Tutorial JSON JQUERY template implementation instructions_jquery

JSON JQUERY template implementation instructions_jquery

May 16, 2016 pm 06:23 PM
jquery json template

However, reproducing data on the client side is also a big problem. It is often very cumbersome to process it with JavaScript. Especially for large batches of data with the same structure, such as tables, the processing method is not satisfactory. If there is a template control, Something like the server-side asp.net Gridview or repeater is much better. Recently I saw a very excellent solution, which made me sigh for the author's exquisite design while being easy to use. This solution It took only a few dozen lines of code to achieve what others would do using tens or even hundreds of K of js libraries. It is John Resig's Microtemplating engine. Master Rick Strahl has an article that describes this in detail ( Client Templating with Jquery). Here I extract the core part to facilitate the learning of Chinese people.

The following program is the microtemplating engine.

Copy the code The code is as follows:

var _tmplCache = {}
this.parseTemplate = function(str, data) {
///
/// Client side template parser that uses <#= # > and <# code #> expressions.
/// and # # code blocks for template expansion.
/// NOTE: chokes on single quotes in the document in some situations
// / use ' for literals in text and avoid any single quote
/// attribute delimiters.
///

/// The text of the template to expand
///
/// Any data that is to be merged. Pass an object and
/// that object's properties are visible as variables.
///
///
var err = "";
try {
var func = _tmplCache[str];
if (!func) {
var strFunc =
"var p=[],print=function() {p.push.apply(p,arguments);};"
"with(obj){p.push('"

str.replace(/[rtn]/g, " ")
.replace(/'(?=[^#]*#>)/g, "t")
.split("'").join("\'")
.split ("t").join("'")
.replace(/<#=(. ?)#>/g, "',$1,'")
.split("< #").join("');")
.split("#>").join("p.push('")
"');}return p.join('' );";

//alert(strFunc);
func = new Function("obj", strFunc);
_tmplCache[str] = func;
}
return func(data);
} catch (e) { err = e.message; }
return "< # ERROR: " err.htmlEncode() " # >";
}

How to use:
Copy code The code is as follows:
parseTemplate($("# ItemTemplate").html(),{ name: "rick", address: { street: "32 kaiea", city: "paia"} } );


Template used in the above program:
Copy code The code is as follows:

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
1 months ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Performance optimization tips for converting PHP arrays to JSON Performance optimization tips for converting PHP arrays to JSON May 04, 2024 pm 06:15 PM

Performance optimization methods for converting PHP arrays to JSON include: using JSON extensions and the json_encode() function; adding the JSON_UNESCAPED_UNICODE option to avoid character escaping; using buffers to improve loop encoding performance; caching JSON encoding results; and considering using a third-party JSON encoding library.

How do annotations in the Jackson library control JSON serialization and deserialization? How do annotations in the Jackson library control JSON serialization and deserialization? May 06, 2024 pm 10:09 PM

Annotations in the Jackson library control JSON serialization and deserialization: Serialization: @JsonIgnore: Ignore the property @JsonProperty: Specify the name @JsonGetter: Use the get method @JsonSetter: Use the set method Deserialization: @JsonIgnoreProperties: Ignore the property @ JsonProperty: Specify name @JsonCreator: Use constructor @JsonDeserialize: Custom logic

How to add PPT mask How to add PPT mask Mar 20, 2024 pm 12:28 PM

Regarding PPT masking, many people must be unfamiliar with it. Most people do not understand it thoroughly when making PPT, but just make it up to make what they like. Therefore, many people do not know what PPT masking means, nor do they understand it. I know what this mask does, and I don’t even know that it can make the picture less monotonous. Friends who want to learn, come and learn, and add some PPT masks to your PPT pictures. Make it less monotonous. So, how to add a PPT mask? Please read below. 1. First we open PPT, select a blank picture, then right-click [Set Background Format] and select a solid color. 2. Click [Insert], word art, enter the word 3. Click [Insert], click [Shape]

Effects of C++ template specialization on function overloading and overriding Effects of C++ template specialization on function overloading and overriding Apr 20, 2024 am 09:09 AM

C++ template specializations affect function overloading and rewriting: Function overloading: Specialized versions can provide different implementations of a specific type, thus affecting the functions the compiler chooses to call. Function overriding: The specialized version in the derived class will override the template function in the base class, affecting the behavior of the derived class object when calling the function.

Quick tips for converting PHP arrays to JSON Quick tips for converting PHP arrays to JSON May 03, 2024 pm 06:33 PM

PHP arrays can be converted to JSON strings through the json_encode() function (for example: $json=json_encode($array);), and conversely, the json_decode() function can be used to convert from JSON to arrays ($array=json_decode($json);) . Other tips include avoiding deep conversions, specifying custom options, and using third-party libraries.

How to use PHP functions to process JSON data? How to use PHP functions to process JSON data? May 04, 2024 pm 03:21 PM

PHP provides the following functions to process JSON data: Parse JSON data: Use json_decode() to convert a JSON string into a PHP array. Create JSON data: Use json_encode() to convert a PHP array or object into a JSON string. Get specific values ​​of JSON data: Use PHP array functions to access specific values, such as key-value pairs or array elements.

Comparison of C++ templates and generics? Comparison of C++ templates and generics? Jun 04, 2024 pm 04:24 PM

The difference between templates and generics in C++: Templates: defined at compile time, clearly typed, high efficiency, and small code size. Generics: runtime typing, abstract interface, provides flexibility, low efficiency.

What are the common applications of C++ templates in actual development? What are the common applications of C++ templates in actual development? Jun 05, 2024 pm 05:09 PM

C++ templates are widely used in actual development, including container class templates, algorithm templates, generic function templates and metaprogramming templates. For example, a generic sorting algorithm can sort arrays of different types of data.

See all articles