element.appendChild(newNode)를 통해 _javascript 기술에 대해 이야기해 보겠습니다.

element.appendChild(newNode) 메서드에서 newNode 자체가 Dom의 노드인 경우 AppendChild 메서드는 더 이상
이 아닌 이동 작업을 수행합니다. 예:

<input type="button" id="btn1" value="button 1"> <input type="button" id="btn2" value="button 2"> <input type="button" id="btn3" value="button 3"> <input type="button" id="btn4" value="button 4">
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.

]

왜냐하면 btn1 자체는 DOM A 노드에 있으므로 AppendChild 작업은 btn1을 복사하는 대신 btn4 뒤로 이동합니다.
이 기능을 사용하면 매우 적은 양의 코드로 대체 텍스트의 원활한 스크롤을 구현할 수 있습니다.

<style> *{border:1px solid green} a{display:block;font-size:15px}; </style> <div id="d" style="width:300px;height:200px;"> <a href="javascript:"> </a>1. 수없이 많은 꿈을 꾸어본 적이 있나요? <a href="javascript:"> </a>2, 그러나 시간이 지날수록 환멸을 느끼게 된다<a href="javascript:"> </a>3. 미래를 기대해본 적이 있나요? <a href="javascript:"> </a>4, 그러나 성장기에 길을 잃었습니다</div>
[Ctrl A 모두 선택 참고:

외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다
]

ㅋㅋㅋ , 참 간단하지 않나요? 올해 5월에 CSDN에 이 방법을 게시했는데, JavaScript 매니아들 사이에서 많은 화제를 불러일으켰습니다
. 이 게시물은 CSDN 홈페이지 상단에 고정되어 300명이 되었습니다.
이 애플리케이션 외에도 테이블 정렬에 이 기능을 사용할 수 있습니다.

다음 테이블 정렬 코드는 단지 appendChild의 사용법을 설명하기 위한 것일 뿐이라는 점에 유의하세요. ff에서 테스트했습니다.<table border id="tbl" width="40%"> <tr> <td>12</td> <td>1</td> </tr> <tr> <td>9</td> <td>2</td> </tr> <tr> <td>15</td> <td>3</td> </tr> <tr> <td>18</td> <td>4</td> </tr> <tr> <td>1</td> <td>5</td> </tr> </table>

[Ctrl A 모두 선택 참고:
외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]

방법 도움이 많이 된다면 이 정렬은 매우 간단합니다.
더 많은 테이블 작업 방법과 고급 사용자 정의 테이블 정렬에 대해서는 내 CSDN의 다른 게시물을 참조하세요. (정렬은 또한appendChild를 사용하여 구현되며 Firefox와 호환됩니다.)
<script> function f(){ document.body.appendChild(document.getElementById("btn1")) } </script><script> // by Go_Rush(阿舜) from http://ashun.cnblogs.com/ var t=setInterval(myfunc,1000) function myfunc(){ d.appendChild(d.firstChild)} d.onmouseover=function(){clearInterval(t)} d.onmouseout=function(){t=setInterval(myfunc,1000)} </script><script> // by Go_Rush(阿舜) from http://ashun.cnblogs.com/ function $A(arrayLike){ for(var i=0,ret=[];i<arrayLike.length;i++) ret.push(arrayLike[i]); return ret } Array.prototype.each=function(f){for(var i=0;i<this.length;i++) f(this[i],i,this)} window.onload=function(){ $A(document.getElementById("tbl").rows).sort(function(tr1,tr2){ return Number(tr1.cells[0].innerHTML)>Number(tr2.cells[0].innerHTML)?1:-1 }).each(function(tr){ document.getElementById("tbl").firstChild.appendChild(tr) }) } </script>