在js代码拼接dom对象到页面上去的模板总结(必看)
每次在js代码里面想动态的拼个dom，然后append到页面上，都是各种麻烦，
要是可以直接在jsp页面弄个隐藏的model那是很好的，用js方法里面的clone方法也是很好的，还可以给不同部分set值。
为了以后简单点，我就把模板摆着，方便后面用得着的时候，复制粘贴。
functionfillDialog(dataArray){
vartarget=$("#dialogTarget");
target.empty();
for(vari=0;i<dataArray.length;i++){
varlabel=$('<labelclass="control-label"style="width:auto;text-align:left;"></label>');
label.text(""+dataArray[i].channelName);
varinput=$("<inputtype=\"text\"/>");
input.prop("name","checkbox");
input.prop("type","checkbox");
input.prop("value",dataArray[i].id);
if(dataArray[i].showInUserStatistic){
input.prop("checked","true");
}
label.prepend(input);
target.append(label);
}
}
vartrs="";
for(vari=0;i<dataArray.length;i++){
varbranchBank=dataArray[i].branch;
varnewUser=dataArray[i].newUserNum;
varnetBoostUser=dataArray[i].netBoostUserNum;
varcloseUser=dataArray[i].closeUserNum;
varactiveUser=dataArray[i].activeUserNum;
varindex=activeUser.indexOf(".");
if(index>0){
//去分行活跃用户数的小数部分如：11.0--->11
activeUser=activeUser.substring(0,index);
}
trs+="<tr><tdtitle='"+branchBank+"'>"+branchBank+"</td>";
trs+="<tdtitle='"+newUser+"'>"+newUser+"</td>";
trs+="<tdtitle='"+netBoostUser+"'>"+netBoostUser+"</td>";
trs+="<tdtitle='"+closeUser+"'>"+closeUser+"</td>";
trs+="<tdtitle='"+activeUser+"'>"+activeUser+"</td>";
trs+="</tr>";
}
newList.append("<tbody>"+trs+"</tbody>");
tableChart.append(newList.show());
var$metric=$("#metric");
$metric.empty();
varoptGroup0=$("<optgrouplabel='常用指标'>");
varoptGroup1=$("<optgrouplabel='不常用指标'>");
varoptGroup2=$("<optgrouplabel='未分组指标'>");
for(vari=0;i<allMetricSources.length;i++){
varm=allMetricSources[i];
if(m!=null&&(m.type==stream_type||m.type==2)){
varoption=$("<option></option>");
option.attr("value",m.metric);
option.attr("data_type",m.data_type);
option.attr("unit",m.unit);
option.html(m.title);
if(m.groupType==0){
optGroup0.append(option);
}elseif(m.groupType==1){
optGroup1.append(option);
}else{
optGroup2.append(option);
}
}
}
$metric.append(optGroup0);
$metric.append(optGroup1);
$metric.append(optGroup2);
if(metric!=undefined){
$metric.val(metric);
}
$metric.trigger("chosen:updated");
functionfillRecoveryTable(data){
var$tableBody=$("#recoveryTable").find("tbody");
$tableBody.empty();
vartrs="";
for(vari=0;i<data.length;i++){
varrecovery=data[i];
trs+="<tr><td>"+recovery.fileName+"</td>";
trs+="<td>"+recovery.timeString+"</td>";
trs+="<td>"+(recovery.result?"成功":"失败")+"</td>";
trs+="<td>"+
"<aonclick=\"removeRecovery('"+recovery.id+"');\"class=\"icon-trashoption\"title=\"删除\"></a>"+
"<aonclick=\"doRecovery('"+recovery.id+"');\"class=\"icon-cogoption\"title=\"一键恢复\"></a></td>";
trs+="</tr>";
}
$tableBody.append(trs);
}
以上这篇在js代码拼接dom对象到页面上去的模板总结(必看)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。