通过javascript怎么实现移动表格的一行

这里一个例子
<table id="test" width="100">
<tr><td>1</td><td bgcolor="red">red</td>
</tr>
<tr><td>2</td><td bgcolor="blue">blue</td>
</tr>
</table>
<input type="button" value="换行" onclick="moveRow(1,0)">
<script type="text/javascript">
function moveRow(r_1,r_2){
var tableID=document.getElementById("test");
tableID.moveRow(r_1,r_2);
}
setInterval('moveRow(1,0)',1000);
</script>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

ff下就要用另一种方式了。
moveRow只用于IE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/ecmascript">
function moveUp(e){
var evt=e||window.event;
var srcEl=evt.target||evt.srcElement;
var oRow=srcEl.parentNode.parentNode;
if(oRow.rowIndex>0){
var oPreRow=oRow.parentNode.rows[oRow.rowIndex-1];
swapRow(oRow,oPreRow);
}
}function moveDown(e){
var evt=e||window.event;
var srcEl=evt.target||evt.srcElement;
var oRow=srcEl.parentNode.parentNode;
if(oRow.rowIndex!=oRow.parentNode.rows.length-1){
var oLstRow=oRow.parentNode.rows[oRow.rowIndex+1];
swapRow(oRow,oLstRow);
}
}function swapRow(oRow1,oRow2){
var strTemp="";
for(var i=0,nLen=oRow1.cells.length;i<nLen;i++){
strTemp=oRow1.cells[i].innerHTML;
oRow1.cells[i].innerHTML=oRow2.cells[i].innerHTML;
oRow2.cells[i].innerHTML=strTemp;
}
}
</script>
</head>
<body>
<table border="1">
<tr>
<td width="423">a </td>
    <td width="205"><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>    </td>
</tr>
<tr>
<td>b </td>
    <td><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>
    </td>
</tr>
<tr>
<td>c</td>
    <td><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>
    </td>
</tr>
<tr>
<td>d</td>
    <td><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>
    </td>
</tr>
<tr>
<td>e </td>
    <td><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>
    </td>
</tr>
<tr>
<td>f </td>
    <td><a href="#" onclick="moveUp(event)">[上移一行]</a>
        <a href="#" onclick="moveDown(event)">[下移一行]</a>
    </td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript">
function getTable(obj)
{
return obj.parentElement.parentElement.parentElement;
}function getRowId(obj)
{
return obj.parentElement.parentElement.rowIndex;
}
function up(obj)
{
var tb = getTable(obj);
var rowId = getRowId(obj);
var tr = tb.rows[rowId];
if(rowId > 0)
{
tr.swapNode(tr.previousSibling);
}
}function down(obj)
{
var tb = getTable(obj);
var rowId = getRowId(obj);
var tr = tb.rows[rowId];
if(rowId < tb.rows.count)
tr.swapNode(nextSibling);
}
</script>
</head><body>
<table border="1">
<tr> <td>a </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button></td> </tr>
<tr> <td>b </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button> </td> </tr>
<tr> <td>c </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button> </td> </tr>
</table>
</body>
</html>
似乎上面几位的代码，firefox下都不好使
<html>
<head><title>换行</title>
<script language="javascript">
function getTable(obj)
{
    return obj.parentElement.parentElement.parentElement;
}function getRowId(obj)
{
    return obj.parentElement.parentElement.rowIndex;
}
function up(obj)
{
    var tb = getTable(obj);
    var rowId = getRowId(obj);
    var tr = tb.rows[rowId];
    if(rowId > 0)
    {
        tr.swapNode(tr.previousSibling);
    }
}function down(obj)
{
    var tb = getTable(obj);
    var rowId = getRowId(obj);
    var tr = tb.rows[rowId];
    var num = document.getElementById("ll").getElementsByTagName("tr").length*1-1;
    if(rowId < num)
    {
        tr.swapNode(tr.nextSibling);
    }}
</script>
</head><body>
<table border="1" id="ll">
<tr> <td>a </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button></td> </tr>
<tr> <td>b </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button> </td> </tr>
<tr> <td>c </td> <td><button onclick="up(this)">[上移一行]</button><button onclick="down(this)">[下移一行]</button> </td> </tr>
</table>
</body>
</html>
ff/ie<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Table test</title>
<style type="text/css">

</style>
</head>
<body>
<table id="table1" bordercolor="#000000" width="200" border="1">
    <tbody>
        <tr>
            <td width="25%">1</td>
            <td width="25%">11</td>
   
            <td width="25%"><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td width="25%"><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>22</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>33</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>4</td>
            <td>44</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>5</td>
            <td>55</td>
            <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
        </tr>
    </tbody>
</table>
</body>
</html><script language="JavaScript" type="text/javascript">

</script>