大家好，
最近的项目遇到一个要交换表格列的功能，而其这个表格的数据有几千行，我的交换方法是：
[code="js"]
function swapNode(node1,node2)
{
var _parent=node1.parentNode;
var _t1=node1.nextSibling;
var _t2=node2.nextSibling;
if(_t1)
_parent.insertBefore(node2,_t1);
else
_parent.appendChild(node2);
if(_t2)
_parent.insertBefore(node1,_t2);
else
_parent.appendChild(node1);
}
[/code]
测试发现：500行数据，交换2个列位置，就耗时 5000多毫秒，1000行数据，浏览器直接死掉。
请教大家有没有更高效的交换方式？？
分享 试试下面的代码，感觉你写的那个速度也不慢，我测试了3000多行数据，结果3到5秒就搞定了。
下面是大体的粗略测试结果
[code="js"]
// Load jQuery google.load("jquery", "1.3.2"); $(function(){ $("#tb1 tr:first td").each(function(i){ $(this).css("cursor","pointer").click(function(){ $("#tb1 tr").each(function(){ var tdlist = $(this).children(); if(tdlist.length > 1){ if(i==0){ swap(tdlist[0],tdlist[1]); } else if(i == (tdlist.length -1)){ swap(tdlist[i],tdlist[i-1]); } else{ swap(tdlist[i],tdlist[i+1]); } } }); }); }); }) function swap(obj1,obj2) { //ie下执行数据比较快，CHROME下执行特别慢，FIREFOX下执行不识别innerText属性 //var temp = obj1.innerText; //obj1.innerText = obj2.innerText; //obj2.innerText = temp; //CHROME（最快了），FIREFOX下执行较快，IE下执行慢 //var _o1 = $(obj1); //var _o2 = $(obj2); //var _temp = _o1.text(); //_o1.text(_o2.text()); //_o2.text(_temp); //CHROME（最快了），FIREFOX下执行较快，IE下执行慢 var _o1 = $(obj1); var _o2 = $(obj2); var _temp = _o1.html(); _o1.html(_o2.html()); _o2.html(_temp); //chrome,firefox,执行较快，IE执行感觉CHROME一样快 // var _parent=obj1.parentNode; //var _t1=obj1.nextSibling; //var _t2=obj2.nextSibling; //if(_t1) // _parent.insertBefore(obj2,_t1); //else // _parent.appendChild(obj2); //if(_t2) // _parent.insertBefore(obj1,_t2); //else // _parent.appendChild(obj1); }[/code] [code="html"]<HTML> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <TITLE> New Document </TITLE> <script src="http://www.google.com/jsapi"> // Load jQuery google.load("jquery", "1.3.2"); $(function(){ $("#tb1 tr:first td").each(function(i){ $(this).css("cursor","pointer").click(function(){ $("#tb1 tr").each(function(){ var tdlist = $(this).children(); if(tdlist.length > 1){ if(i==0){ swap(tdlist[0],tdlist[1]); } else if(i == (tdlist.length -1)){ swap(tdlist[i],tdlist[i-1]); } else{ swap(tdlist[i],tdlist[i+1]); } } }); }); }); }) function swap(obj1,obj2) { //ie下执行数据比较快，CHROME下执行特别慢，FIREFOX下执行不识别innerText属性 //var temp = obj1.innerText; //obj1.innerText = obj2.innerText; //obj2.innerText = temp; //CHROME（最快了），FIREFOX下执行较快，IE下执行慢 //var _o1 = $(obj1); //var _o2 = $(obj2); //var _temp = _o1.text(); //_o1.text(_o2.text()); //_o2.text(_temp); //CHROME（最快了），FIREFOX下执行较快，IE下执行慢 var _o1 = $(obj1); var _o2 = $(obj2); var _temp = _o1.html(); _o1.html(_o2.html()); _o2.html(_temp); //chrome,firefox,执行较快，IE执行感觉CHROME一样快 // var _parent=obj1.parentNode; //var _t1=obj1.nextSibling; //var _t2=obj2.nextSibling; //if(_t1) // _parent.insertBefore(obj2,_t1); //else // _parent.appendChild(obj2); //if(_t2) // _parent.insertBefore(obj1,_t2); //else // _parent.appendChild(obj1); }| head1 | head2 | head3 | head4 |
| 1 | 2 | 3 | 4 |
| 1 | 2 | 3 | 4 |
| 1 | 2 | 3 | 4 |
分享
