JavaScript动态添加表格行（使用模板、标记）

核心提示： 2， 进行填充时，JavaScript动态添加表格行（使用模板、标记）(4)，实现了两种情况，一种用根据元素的name,别一种则是根据标记填充1//动态添加表格行2//functionname为“setObjValueByName”为根据元素name，7functiona

2， 进行填充时，实现了两种情况，一种用根据元素的name,别一种则是根据标记填充

1//　动态添加表格行
2//　functionname为“setObjValueByName”为根据元素name，
3//要求names为元素名称，value为相对应的值
4//　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
5//functionname为“”为标记填充
6//要求names为一个对象，value为null
7function　addInstanceRow(tableId,names,values,functionName)

3， 进行标志的填充时，使用正则表达式进行标记的查找，找到标记后到entity中取相应的属性的值，取出属性的值之后，要用 替换字符串中的空格，不然显示时会有问题，当属性值为空时用 替换标记符号，代码在以下函数中。

　1//根据标志设置添加值
　2function　setObjValueByFlag(obj,entity){
　3　　　　var　objTemp=obj.parentNode;
　4　　　　var　arrMatches=objTemp.innerHTML.match(/\${\w+}/g);
　5　　　　if(typeof(arrMatches)=="undefined"||arrMatches==null||typeof(arrMatches.length)=="undefined"||arrMatches.length==null)
　6　　　　　　　　return;
　7　　　　var　tempValue="";
　8　　　　var　propertyValue="";
　9　　　　for(var　i=0;i<arrMatches.length;i++){
10　　　　　　　　tempValue=arrMatches[i].replace(/\${|}/g,"");
11　　　　　　　　propertyValue=getEntityPropertyValue(entity,tempValue);
12　　　　　　　　if(propertyValue!=null){
13　　　　　　　　　　　　if(typeof(propertyValue)=="string"){
14　　　　　　　　　　　　　　　　if(propertyValue!="")
15　　　　　　　　　　　　　　　　　　　　propertyValue=propertyValue.replace(/\s/g," ");
16　　　　　　　　　　　　　　　　else
17　　　　　　　　　　　　　　　　　　　　propertyValue=" ";
18　　　　　　　　　　　　}　　　　
19　　　　　　　　　　　　objTemp.innerHTML=objTemp.innerHTML.replace(arrMatches[i],propertyValue);　　　
20　　　　　　　　}
21　　　　　　　　else{
22　　　　　　　　　　　　objTemp.innerHTML=objTemp.innerHTML.replace(arrMatches[i]," ");
23　　　　　　　　}
24　　　　}
25}

4， 对于填充标志的做法，刚开始的思路是，直接将模板行中的tr下的内容当成文本进行标志的替换，但是显示时没有内容，于是只能逐个把td中的内容对标志进行替换，发现显示时是正确的，这个地方使我有点困惑。很明显前者的做法效率更高，却莫名其妙地显不出来，只能退而求其次了。

函数调用说明

　1//见上面说明，这是添加行最基本的对外函数　　　　
　2function　addInstanceRow(tableId,names,values,functionName)
　3　　　　
　4//添加实体列表添加表格中，有几个entity则添加几行
　5//tableId　　　　要动态添加行的Table的ID值
　6//entityList　对象数组　Array类型，
　7function　addRowByEntityList(tableId,entityList)
　8
　9//将一个实体添加到一行
10function　addRowByEntity(tableId,entity)
11
12//删除触发事件控件所在的行
13function　deleteThisRow(targetControl)
14
15//删除表格下的所有行
16function　deleteAllRow(tableId)
17

在IE6,7，firefox2,3测试没问题，有问题留言或邮件badwps@163.com，谢谢

本文示例源代码或素材下载