[Javascript]Table模版操作

[Javascript]Table模版操作

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title></title>
        <meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
        <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
        <script language="javascript">
            var objTable;

            function PageLoad()
            {
                objTable = document.getElementById( "tbNew" );        //找到操作Table
            }

            function tdvalue()
            {
                var objTempRow = objTable.rows[0];        //找到Table的模版行
                var objNewRow = objTable.insertRow( objTable.rows.length );        //在Table的末尾新增一行
                objNewRow.id = objTable.rows.length - 1;
                //以模版行建立新行内容
                for ( var i=0 ; i<objTempRow.cells.length ; i++ )
                {
                    var objNewCell = objNewRow.insertCell( i );

                    objNewCell.innerHTML = objTempRow.cells[i].innerHTML;
                }
            }

            function DeleteTableRow()
            {
                if ( objTable.rows.length -1 > 0 )
                {
                    objTable.deleteRow(objTable.rows.length-1);
                }
                else
                {
                    //
                }
            }

            window.onload = PageLoad;
        </script>
    </head>
    <body>
        <form id="Form1" name="Form1">
            <input id="btnInsert" name="btnInsert" type="button" onclick="tdvalue()" value="添加新行" />
            <input id="btnDelete" name="btnDelete" type="button" onclick="DeleteTableRow()" value="删除末行" />
        </form>
        <TABLE id="tbNew" cellSpacing="1" cellPadding="1" width="100%" border="1">

            
            <TR>
                <TD><input id="txtData_1" name="txtData_1" type="text" value=""/></TD>
                <TD><input id="txtData_2" name="txtData_2" type="text" value=""/></TD>
                <TD><input id="txtData_3" name="txtData_3" type="text" value=""/></TD>
            </TR>
            

        </TABLE>
    </body>
</html>
相关阅读:
js库链接
 小程序实现textarea行数自动增加
 小程序中公告消息自动向左滚动（关闭三次之后不再提示公告信息）
jQuery实现点击div外的区域，来隐藏指定节点
 Unity AssetBundle爬坑手记
 换装demo随手记
 Untiy PoolManager随手记
 unity常用插件
 Untiy一些方法前特殊标签记录
 Unity网格合并_材质合并
原文地址：https://www.cnblogs.com/HD/p/153192.html