javascript Table 中2个列（TD）的交换实现代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT="majianan"> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%3C!--%20%0D%0Afunction%20swapNode(node1%2Cnode2)%20%0D%0A%7B%20%0D%0Avar%20_parent%3Dnode1.parentNode%3B%20%0D%0Avar%20_t1%3Dnode1.nextSibling%3B%20%0D%0Avar%20_t2%3Dnode2.nextSibling%3B%20%0D%0Aif(_t1)%20%0D%0A_parent.insertBefore(node2%2C_t1)%3B%20%0D%0Aelse%20%0D%0A_parent.appendChild(node2)%3B%20%0D%0Aif(_t2)%20%0D%0A_parent.insertBefore(node1%2C_t2)%3B%20%0D%0Aelse%20%0D%0A_parent.appendChild(node1)%3B%20%0D%0A%7D%20%0D%0Afunction%20swap()%7B%20%0D%0Avar%20t1%20%3D%20document.getElementById(%22t1%22).value%3B%20%0D%0Avar%20t2%20%3D%20document.getElementById(%22t2%22).value%3B%20%0D%0AswapNode(document.getElementById(t1)%2Cdocument.getElementById(t2))%3B%20%0D%0A%7D%20%0D%0A%2F%2F%20--%3E%3C%2Fscript%3E"> 
</HEAD> 
<BODY> 
<table> 
<tr> 
<td id='a'>[a]</td> 
<td id='b'>[b]</td> 
<td id='c'>[c]</td> 
<td id='d'>[d]</td> 
<td id='e'>[e]</td> 
</tr> 
</table> 
<tr><td><input id='t1' type="text" value="a"></td></tr> 
<tr><td><input id='t2' type="text" value="b"></td></tr> 
<tr><td><input type="button" value="swap" onclick="swap()"></td></tr> 
</BODY> 
</HTML>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

　　上面的格式，比较奇怪，我用js稍微改了下，文本框分别是要转换的索引，不能随便输。

<!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 content="text/html;charset=gb2312" http-equiv=Content-Type> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT="majianan"> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%3C!--%20%0D%0A%0D%0Afunction%20swapNode(node1%2Cnode2)%20%0D%0A%7B%20%0D%0Avar%20_parent%3Dnode1.parentNode%3B%20%0D%0Avar%20_t1%3Dnode1.nextSibling%3B%20%0D%0Avar%20_t2%3Dnode2.nextSibling%3B%20%0D%0Aif(_t1)%20%0D%0A_parent.insertBefore(node2%2C_t1)%3B%20%0D%0Aelse%20%0D%0A_parent.appendChild(node2)%3B%20%0D%0Aif(_t2)%20%0D%0A_parent.insertBefore(node1%2C_t2)%3B%20%0D%0Aelse%20%0D%0A_parent.appendChild(node1)%3B%20%0D%0A%7D%20%0D%0A%0D%0Afunction%20swap()%7B%20%0D%0Avar%20t1%20%3D%20document.getElementById(%22t1%22).value%3B%20%0D%0Avar%20t2%20%3D%20document.getElementById(%22t2%22).value%3B%20%0D%0AswapNode(document.getElementById(t1)%2Cdocument.getElementById(t2))%3B%20%0D%0A%7D%20%0D%0A%2F%2F%20--%3E%3C%2Fscript%3E"> 
</HEAD>

</table> 
<tr><td><input id='t1' type="text" value="a"></td></tr> 
<tr><td><input id='t2' type="text" value="b"></td></tr> 
<tr><td><input type="button" value="swap" onclick="swap()"></td></tr> 
</BODY> 
</HTML>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程