js模板引擎 html,JS 模板引擎

模板引擎

数据未绑定

数据绑定后

模板引擎

//template模板

var str = "我的名字叫：@name@，学号是：@xuehao@，是@banji@的学生。";

//替换的字典/数据

var dictionary = {

"name" : "小明",

"xuehao" : 12345,

"banji" : "三班"

}

//数据绑定函数

function compile(template,dic){

return template.replace(/\@([a-z]+)\@/gi,function(match,$1,index,str){

return dic[$1];

});

}

//调用数据绑定函数

var str = compile(str,dictionary);

//输出结果

alert(str);

append()了解

append() 方法在被选元素的结尾插入指定内容。

模板： $(selector).append(content);

参数

描述

content

指定被插入的内容，content的可能的值:1.HTML 代码 - 比如 ("

selector

要被插入内容的匹配元素

append

function appendText(){

var txt1="

文本。

"; // 使用 HTML 标签创建文本

var txt2=$("

var txt3=document.createElement("p");

txt3.innerHTML="文本。"; // 使用 DOM 创建文本 text with DOM

$("body").append(txt1,txt2,txt3); // 追加新元素

}

这是一个段落。

追加文本