1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta charset="UTF-8">
5 <title>鼠标单击Button1后将Button1移动到Button2的后面</title>
6 </head>
7 <body>
8 <div>
9 <input type="button" id="button1" value="1" onclick="moveBtn(this);">
10 <input type="button" id="button2" value="2"/>
11 </div>
12 <script type="text/javascript">
13 function moveBtn(obj) {
14
15 var clone = obj.cloneNode(true);
16 var parent = obj.parentNode;
17 parent.appendChild(clone);
18 parent.removeChild(obj);
19 }
20 </script>
21 </body>
22
23
24 </html>
点击前：
点击后：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>鼠标单击Button1后将Button1移动到Button2的后面</title>
</head>
<body>
<div>
<input type="button" id="button1" value="1" onclick="moveBtn(this);">
<input type="button" id="button2" value="2"/>
</div>
<script type="text/javascript">
function moveBtn(obj) {
var clone = obj.cloneNode(true);
var parent = obj.parentNode;
parent.appendChild(clone);
parent.removeChild(obj);
}
</script>
</body>
</html>