Heim >Web-Frontend >js-Tutorial >javascript Table 中2个列（TD）的交换实现代码_javascript技巧

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

WBOYOriginal: 2016-05-16 18:55:581088Durchsuche

<title> New Document </title> 
<meta name="Generator" content="EditPlus"> 
<meta name="Author" content="majianan"> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<script type="text/javascript"></script> 
 
 
<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>

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

上面的格式，比较奇怪，我用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); 
}

function swap(){ 
var t1 = document.getElementById("t1").value; 
var t2 = document.getElementById("t2").value; 
swapNode(document.getElementById(t1),document.getElementById(t2)); 
} 
// --></script>

</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>

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：javascript 模拟select下拉列表特效_表单特效Nächster Artikel：检测是否已安装 .NET Framework 3.5的js脚本_javascript技巧

In Verbindung stehende Artikel

Mehr sehen