表单重置的问题

有如下 代码 点击新增 会新增一行 但我要是点重置按键 就不会把表单还原成最初的状态  问问大家该如何来实现  即表单原先是什么样的 点下重置就会还原成什么样的  而不仅只是表单中的值有还原 而其它的不还原

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>增加Table行</title>
    </head>
    <script>
        function addRow(obj)
        {
        //添加一行
        var newTr = testTbl.insertRow();
        //添加两列
        var newTd0 = newTr.insertCell();
        var newTd1 = newTr.insertCell();
        //设置列内容和属性
        newTd0.innerHTML = '<input type=checkbox id="box4">';
        newTd1.innerText= '新加行';
        }
    </script>
    <body>
    <form >
        <table id="testTbl" border=1>
            <tr id="tr1">
                <td ><input type=checkbox id="box1"></td>
                <td id="b">第一行</td>
            </tr>
            <tr id="tr2">
                <td ><input type=checkbox id="box2"></td>
                <td id="b">第二行</td>
            </tr>
            <tr id="tr3">
                <td ><input type=checkbox id="box3"></td>
                <td>第三行</td>
            </tr>
        </table>        
        <br />
        <input type="button" id="add" onclick="addRow();" value="Add Row" />
        <input type="reset" value="RESET"></form>
    </body>
</html>

你是要这种效果么?




增加Table行

<br> var old_form = &quot;&quot;;<br> function addRow(obj)<br> {<br> //添加一行<br> var newTr = testTbl.insertRow();<br> //添加两列<br> var newTd0 = newTr.insertCell();<br> var newTd1 = newTr.insertCell();<br> //设置列内容和属性<br> newTd0.innerHTML = &#39;<input type=checkbox id="box4">&#39;;<br> newTd1.innerText= &#39;新加行&#39;;<br> }<br> function getForm(){<br> old_form = document.getElementsByTagName(&quot;form&quot;)[0].innerHTML;<br> }<br> function resetForm(){<br> document.getElementsByTagName(&quot;form&quot;)[0].innerHTML = old_form;<br> }<br>















第一行
第二行
第三行







给按钮添加事件,刷新页面就是了

把那个表格放进

标签里