js动态添加<tr><td>

1.HTML CODE:

<form id="addNewsFormData" name="addNewsFormData" isCheck="true" action="controller.SysRuleModelController">

 <table id="addNewsTableId" class="formTableSwap" align="center" cellpadding="0" cellspacing="1" >

<tr>

  <th> 类型：</th>

  <td > 

          <select id="dtomodelType" name="modelType">

              <option value="1" >业务模型</option>

              <option value="2" >实体类</option>

          </select>

  </td>

  <th> 中文名 ：</th>

  <td > 

  <input type="text" class="text" id="dtochName" name="chName" notNull="false" maxLength="50" value="" />

  </td>

  <th> 英文名 ：</th>

  <td > 

  <input type="text" class="text" id="dtoenName" name="enName" notNull="false" maxLength="100" value="" />

  </td>

</tr>

<tr>

  <th> 备注 ：</th>

  <td colspan="5"> 

  <textarea id="dtoremark" name="remark" maxLength="100" rows="5" cols="60"></textarea>

  </td>

</tr>

  </table>

属性管理

<div class="contentPanel">

    <table id="tab"  class="formTableSwap" align="center" cellpadding="0" cellspacing="1">

            <tr>

                <td style="width: 5px;">序号</td>

                <td>属性中文名</td>

                <td>属性英文名</td>

                <td>数据类型</td>

                <td>长度</td>

                <td>引用字典编码</td>

                <td>描述</td>

                <td>操作</td>

           </tr>

           <tr id="1">

                <td><input type="text" name="modelAttrs[0].sequence" value="1"></td>

                <td><input type="text"  class="text" name="modelAttrs[0].chName" notNull="false" maxLength="50" value="" ></td>

                <td><input type="text"  class="text" name="modelAttrs[0].enName" notNull="false" maxLength="100" value="" ></td>

                <td>

                    <select name="modelAttrs[0].dataType" >

                        <option value="1" >字符型</option>

                        <option value="2" >数字型</option>

                        <option value="3" >日期型</option>

                        <option value="4" >浮点型</option>

                    </select>

                </td>

                <td><input type="text"  class="text" name="modelAttrs[0].dataLong" maxLength="50" value="" ></td>

                <td><input type="text"  class="text" name="modelAttrs[0].dictCode" maxLength="50" value="" ></td>

                <td><input type="text"  class="text" name="modelAttrs[0].remark" maxLength="50" value="" ></td>

                <td><a href="#" target="_blank" rel="external nofollow" οnclick="deltr(1)">删除</a></td>

           </tr>

        </table>

        <table class="formTableSwap" align="center" cellpadding="0" cellspacing="1">

            <tr><td style="text-align:right;width: 800px;"><input type="button" id="but" value="增加"/></td></tr>

        </table>

</form>

</div>

</body>

<script type="text/javascript">

   $(document).ready(function(){  

       //增加<tr/>

    $("#but").click(function(){

        var _len = $("#tab tr").length;

        alert(_len)

        $("#tab").append("<tr id="+_len+" align='center'>"

                            +'<td><input type="text" name="modelAttrs['+(_len-1)+'].sequence" value="'+_len+'"></td>'

                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].chName" notNull="false" maxLength="50" value="" ></td>'

                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].enName" notNull="false" maxLength="100" value="" ></td>'

                            +'<td><select name="modelAttrs['+(_len-1)+'].dataType">'

                            +'<option value="1" >数字型</option>'

                            +'<option value="2" >字符型</option>'

                            +'<option value="3" >日期型</option>'

                            +'<option value="4" >浮点型</option>'

                            +'</select></td>'

                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].dataLong"  maxLength="50" value="" ></td>'

                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].dictCode"  maxLength="50" value="" ></td>'

                            +'<td><input type="text"  class="text" name="modelAttrs['+(_len-1)+'].remark" maxLength="50" value="" ></td>'

                            +"<td><a href=\'#\' οnclick=\'deltr("+_len+")\'>删除</a></td>"

                        +"</tr>");            

    });

    });

 //删除<tr/>

   function deltr(index){

       //var _len = $("#tab tr").length;

       $("tr[id='"+index+"']").remove();//删除当前行

     }