Ejs v9 javascript template System

The current version is changed back to v6. The back-end data can be conveniently viewed and debugged only with @ frontend. Yesterday, I also discussed the necessity with a TX front-end engineer. Obtain the variables to be filled in the template and compare them with the JSON data transmitted from the backend to verify the data as soon as possible. With this technology, you can take a look at the PHP variable naming, with a $ prefix.
In earlier versions, if the output statement contains a semicolon or comma, an error is returned.
Copy codeThe Code is as follows:
<Script type = "tmpl" id = "table_tmpl">
<Table>
<& For (var I = 0, tl = @ trs. length, tr; I <tl; I ++) {&>
<& Tr = @ trs [I]; &>
<Tr>
<Td> <& = tr. name; &> </td> <& = tr. age; &> </td> <& = tr. sex | "male" &> </td>
</Tr>
<&} &>
</Table>
<& # How can I not support images? &>

</Script>

Because the internally generated string looks like this:
_ Views (data. tr. name ;)
To prevent the user from dropping a comma or semicolon, this version will automatically help you.
Copy codeThe Code is as follows:
RlastSemi =/[,;] \ s * $/
// Omitted
Case "=": // process the variables returned by the background (output to the page );
Logic = els [0]. substring (1 );
If (logic. indexOf ("@")! =-1 ){
Temp. push (startOfHTML, logic. replace (rAt, "$ 1data."). replace (rlastSemi, ''), endOfHTML );
} Else {
Temp. push (startOfHTML, logic. replace (rlastSemi, ''), endOfHTML );
}
Break;

Example
The following is a template, which is placed in the script tag where the browser will ignore parsing JS Code. Note that both trs and href carry the @ identifier.
Copy codeThe Code is as follows:
<Script type = "tmpl" id = "table_tmpl">
<Table>
<& For (var I = 0, tl = @ trs. length, tr; I <tl; I ++) {&>
<& Tr = @ trs [I]; &>
<Tr>
<Td> <& = tr. name &> </td> <& = tr. age &> </td> <& = tr. sex | "male" &> </td>
<& # Import sub-templates &>
<& = $. Ejs ("tds_tmpl"); &>
</Tr>
<&} &>
</Table>
<& # How can I not support images? &>

</Script>
<! -- This is a sub-template -->
<Script type = "tmpl" id = "tds_tmpl">
<Td> static tables </d>
</Script>

This is its JS Code:
Copy codeThe Code is as follows:
$. Require ("ready, more/ejs, node", function (){
Var trs = [
{Name: "invisible killer", age: 29, sex: "male "},
{Name: "Sola", age: 22, sex: "male "},
{Name: "fesyo", age: 23, sex: "female "},
{Name: "Love demon pot", age: 18, sex: "male "},
{Name: "Miyazaki", age: 25, sex: "male "},
{Name: "You don't understand", age: 30, sex: "female "}
]
Var html = $. ejs ("table_tmpl ",{
Trs: trs,
Href: http://www.jb51.net//rubylouvre/202906/o_type4.jpg"
});
$ ("# Table_tc" ).html (html)
});



Ejs source code
Copy codeThe Code is as follows:
$. Define ("ejs", "lang", function (){
Var
_ StartOfHTML = "\ t _ views. push (",
_ EndOfHTML = "); \ n ",
SRight = "&> ",
RLeft =/\ s * <& \ s */,
RRight =/\ s * &> \ s */,
RAt =/(^ | [^ \ w \ u00c0-\ uFFFF _]) (@) (? = \ W)/g,
RLastSemi =/[,;] \ s * $/
Var ejs2 = $. ejs = function (id, data ){
Data = data | {};
If (! Ejs2 [id]) {
Var rleft = rLeft,
Rright = rRight,
Sright = sRight,
RlastSemi = rLastSemi,
StartOfHTML = _ startOfHTML,
EndOfHTML = _ endOfHTML, str, logic,
El = document. getElementById (id );
If (! El) throw "can not find the target element ";
Str = el. innerHTML;
Var arr = str. trim (). split (rleft ),
Buff = ["var _ views = []; \ n"], temp = [], I = 0, n = arr. length, els, segment;
While (I <n) {// analyzes data row by row to prevent ambiguity
Segment = arr [I ++];
Els = segment. split (rright );
If (~ Segment. indexOf (sright) {// here els. length = 2 is not used to avoid the split bug of IE.
Switch (els [0]. charAt (0 )){
Case "=": // process the variables returned by the background (output to the page );
Logic = els [0]. substring (1 );
If (logic. indexOf ("@")! =-1 ){
Temp. push (startOfHTML, logic. replace (rAt, "$ 1data."). replace (rlastSemi, ''), endOfHTML );
} Else {
Temp. push (startOfHTML, logic. replace (rlastSemi, ''), endOfHTML );
}
Break;
Case "#": // process comments
Break;
Default: // processing logic
Logic = els [0];
If (logic. indexOf ("@")! =-1 ){
Temp. push (logic. replace (rAt, "$ 1data."), "\ n ");
} Else {
Temp. push (logic, "\ n ");
}
}
// Process static HTML parts
Els [1] & temp. push (startOfHTML, $. quote (els [1]), endOfHTML)
} Else {
// Process static HTML parts
Temp. push (startOfHTML, $. quote (els [0]), endOfHTML );
}
}
Ejs2 [id] = new Function ("data", buff. concat (temp ). join ("") + '; return _ views. join ("");');
Return ejs2 [id] (data)
}
Return ejs2 [id] (data)
}
})
// Ejs v9!