Javascript 如何在上下移动时免除第一行或如何自动排列数字

Html:

小提琴：

---

我正在表格中上下移动行。Mmy第一列是编号列，它应该保持不变。或者在上下移动箭头时，它应该自动排列编号。我该怎么做？

循环所有

tr

并将其索引添加到第一个

td

function get_previoussibling(n)
{
    x=n.previousSibling;
    while (x.nodeType!=1)
      {
      x=x.previousSibling;
      }
    return x;
} 

function get_nextsibling(n)
{
    x=n.nextSibling;
    while ( x != null && x.nodeType!=1)
      {
      x=x.nextSibling;
      }
    return x;
} 
function MoveUp()
    {
        var table,
            row = this.parentNode;

        while ( row != null ) {
            if ( row.nodeName == 'TR' ) {
                break;
            }
            row = row.parentNode;
        }
        table = row.parentNode;
        table.insertBefore ( row, get_previoussibling( row ) );
    }

    function MoveDown()
    {
        var table,
            row = this.parentNode;

        while ( row != null ) {
            if ( row.nodeName == 'TR' ) {
                break;
            }
            row = row.parentNode;
        }
        table = row.parentNode;
        table.insertBefore ( row, get_nextsibling ( get_nextsibling( row ) ) );
    }

---

我认为最简单的解决方案是将第一行包装在标记中，将所有其他行包装在标记中。这样，您就不必修改javascript（）

一
二
⇧
⇩
三
⇧
⇩
四
⇧
⇩
五
⇧
⇩

我认为它能工作

删除css中的这一行，table.myTable tr td:first child:before{content:counter（rowNumber，decimal）

1.
一
⇧
⇩
2.
二
⇧
⇩
3.
三
⇧
⇩
4.
四
⇧
⇩
5.
五
⇧
⇩

应该排列哪个数字？你能用小提琴解释一下吗？我看到有4列。@punitha subramani v first column 12345你能建议如何避免第一列上下移动吗？这个解决方案不适合me@user3383271与使用双表相比，第一个表只包含行数，第二个表包含可移动的内容。

function get_previoussibling(n)
{
    x=n.previousSibling;
    while (x.nodeType!=1)
      {
      x=x.previousSibling;
      }
    return x;
} 

function get_nextsibling(n)
{
    x=n.nextSibling;
    while ( x != null && x.nodeType!=1)
      {
      x=x.nextSibling;
      }
    return x;
} 
function MoveUp()
    {
        var table,
            row = this.parentNode;

        while ( row != null ) {
            if ( row.nodeName == 'TR' ) {
                break;
            }
            row = row.parentNode;
        }
        table = row.parentNode;
        table.insertBefore ( row, get_previoussibling( row ) );
    }

    function MoveDown()
    {
        var table,
            row = this.parentNode;

        while ( row != null ) {
            if ( row.nodeName == 'TR' ) {
                break;
            }
            row = row.parentNode;
        }
        table = row.parentNode;
        table.insertBefore ( row, get_nextsibling ( get_nextsibling( row ) ) );
    }

$.each($('.myTable tr'), function(index, element){
    $(this).find('td').eq(0).text(index+1);
});

<table class="myTable" border="1" width="80%">
<thead>    
<tr >
    <td></td>
    <td>one</td>
    <td></td>
    <td></td>
</tr>
    </thead>
    <tbody>
<tr>
        <td></td>
            <td>two</td> 
<td><button onClick="MoveUp.call(this);">&#8679;</button></td>
<td><button onClick="MoveDown.call(this);">&#8681;</button></td>
    </tr>
    <tr>
        <td></td>
            <td>three</td> 
<td><button onClick="MoveUp.call(this);">&#8679;</button></td>
<td><button onClick="MoveDown.call(this);">&#8681;</button></td>
    </tr>
        <tr>
        <td></td>
            <td>four</td> 
<td><button onClick="MoveUp.call(this);">&#8679;</button></td>
<td><button onClick="MoveDown.call(this);">&#8681;</button></td>
    </tr>
        <tr>
        <td></td>
            <td>five</td> 
<td><button onClick="MoveUp.call(this);">&#8679;</button></td>
<td><button onClick="MoveDown.call(this);">&#8681;</button></td>
    </tr>
    </tbody>
        </table>

    <table class="myTable" border="1" width="80%">
    <tr >
        <td>1</td>
        <td>one</td>
        <td><button onClick="MoveUp.call(this);">&#8679;</button></td>
        <td><button onClick="MoveDown.call(this);">&#8681;</button></td></tr>
    <tr>
            <td>2</td>
                <td>two</td> 
    <td><button onClick="MoveUp.call(this);">&#8679;</button></td>
    <td><button onClick="MoveDown.call(this);">&#8681;</button></td>
        </tr>
        <tr>
            <td>3</td>
                <td>three</td> 
    <td><button onClick="MoveUp.call(this);">&#8679;</button></td>
    <td><button onClick="MoveDown.call(this);">&#8681;</button></td>
        </tr>
            <tr>
            <td>4</td>
                <td>four</td> 
    <td><button onClick="MoveUp.call(this);">&#8679;</button></td>
    <td><button onClick="MoveDown.call(this);">&#8681;</button></td>
        </tr>
            <tr>
            <td>5</td>
                <td>five</td> 
    <td><button onClick="MoveUp.call(this);">&#8679;</button></td>
    <td><button onClick="MoveDown.call(this);">&#8681;</button></td>
        </tr>
            </table>