js操作表格添加删除功能，每个tr的序列问题

//JS功能部分
    window.onload = function(){
        var oTab1 = document.getElementById("tab1");
        var oUserName = document.getElementById("username");
        var oAge = document.getElementById("age");
        var btnAdd = document.getElementById("add");
        var id = oTab1.tBodies[0].rows.length + 1;

        btnAdd.onclick = function(){
            var oTr = document.createElement("tr");

            var oTd = document.createElement("td");
            oTd.innerHTML = id++;
            oTr.appendChild(oTd);

            var oTd = document.createElement("td");
            oTd.innerHTML = oUserName.value;
            oTr.appendChild(oTd);

            var oTd = document.createElement("td");
            oTd.innerHTML = oAge.value;
            oTr.appendChild(oTd);

            var oTd = document.createElement("td");
            oTd.innerHTML = '<a href="javascript:;">删除</a>';
            oTr.appendChild(oTd);

            oTd.getElementsByTagName("a")[0].onclick = function(){
                //tBodies不能少        这里的this是a，但我们要删除的是tr(是a的爷爷)
                oTab1.tBodies[0].removeChild(this.parentNode.parentNode);
            }

            oTab1.tBodies[0].appendChild(oTr);
        }
    }

<!--body部分-->
    姓名: <input id="username" type="text">
    年龄: <input id="age" type="text">
    <input type="button" id="add" value="添加">
    <table id="tab1" border="1px" width="400px">
        <thead>
            <td>ID</td>
            <td>姓名</td>
            <td>年龄</td>
            <td>操作</td>
        </thead>
        <tbody> <!--tbody一定加，好习惯-->
            <tr>
                <td>1</td>
                <td>Blue</td>
                <td>27</td>
                <td></td>
            </tr>
            <tr>
                <td>2</td>
                <td>张三</td>
                <td>22</td>
                <td></td>
            </tr>
            <tr>
                <td>3</td>
                <td>李四</td>
                <td>39</td>
                <td></td>
            </tr>
            <tr>
                <td>4</td>
                <td>王五</td>
                <td>20</td>
                <td></td>
            </tr>
            <tr>
                <td>5</td>
                <td>马六</td>
                <td>25</td>
                <td></td>
            </tr>
        </tbody>
    </table>    

代码有点长，不过大神眼里一般都是小儿科了，简单的一个表格添加删除的小功能。
问这么个问题：
js中先把表格的tr个数全部存入id

var id = oTab1.tBodies[0].rows.length + 1;

问题在这！！！
后面在添加一行tr的时候
用的却是id ++，比如我的代码原本是5行,5存入了变量id中，后面来个i++不就变成6行了？我实际上只有5行才对啊。然后再添加一行不就变成7行了（实际只有6行才对）？

var oTd = document.createElement("td");
oTd.innerHTML = id++;
oTr.appendChild(oTd);

---

你在删除的事件中添加一句id--;就可以了。
添加的时候，id+1，那么删除的时候id也要-1.

当然，这种涉及到排序的需要考虑的因素就很多，比如在中间删掉一个，id序列会是什么情况？中间删掉一个再添加一个又是什么情况？这些都要考虑，肯定处理的逻辑就要复杂一些。

---

1，你在一个函数中多次使用统一变量不太好之外，并没有错。最好把变量命名改成不同的。
2，你开始存入的是行数加1，比如这个例子id开始是6，然后点击的时候，第一个oTd的innerHTML赋值为id，也就是6，刚好是添加的序数，然后id自加。估计你是对前加加和后加加的不太理解