Several ways to populate the list with JS

Application scenario: Returns a JSON-formatted list data on the server, with JS being used in the front-end page to draw the DOM 1, according to the HTML template to replace the data part of the implementation modeHTML templates

<!--Templates -<Divstyle= "Display:none;"><ulID= "Itemdatatempletecontent"><Lionclick= "Getplan ({itemdata_id});"><span>Name: {Itemdata_name}</span></Li></ul></Div>

JS method

//create content from templates, add dom by using string substitution stitching when more content is available    //The template uses the format "{itemdata_xxx}" as the label for the property substitution value, and the label is replaced when it encounters the    //@param templete Template content    //@param data Rows    //@param format formatting (such as date formatting), you can have no    functionGethtmlbytemplete (templete, data, format) {returnTemplete.replace (/{itemdata_ ([^}]+)}/g,function($ A, $){            varv = data[$1] ; if(typeof(format)!== ' undefined ' && format!==NULL) {v= Format ($, V); }            returnv;     }) ; }

Populating Code Snippets

var templetestr = xxx.innerhtml;      var content = XXXXX;      var itemhtmllist = [];       for (var i=0; i < list.length; i++) {        Itemhtmllist.push (Gethtmlbytemplete (Templetestr, List[i), itemdataformatdate));     }    

2, using the jquery clone method to generate the DOM according to the template, and then join the data when large should not use 3, the use of JS string splicing method

Several ways to populate the list with JS