<li>元素的排序
要点：
- getElementsByTagName("li")返回的是HTMLCollection对象，这个对象不同于Array对象，不能使用sort()方法进行排序~
- 下面方法的要点是借壳Array对象，同时使用了appendChild的特性~
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <script> 7 window.onload = function () { 8 var ul = document.getElementById("ul1"); 9 var btn = document.getElementById("btn1"); 10 var aLi = ul.getElementsByTagName("li"); 11 12 btn.onclick = function () { 13 var arr = []; // 1. 创建一个Array对象 14 15 for (var i=0; i<aLi.length; i++) { 16 arr[i] = aLi[i]; // 2. 借壳Array对象 17 } 18 // 3. 排序 19 arr.sort(function (li1, li2) { 20 return parseInt(li1.innerHTML) < parseInt(li2.innerHTML); 21 }); 22 // 4. 利用appendChild的特性 23 for (var i=0; i<arr.length; i++) { 24 ul.appendChild(arr[i]); 25 } 26 } 27 } 28 </script> 29 </head> 30 <body> 31 <input type="button" id="btn1" value="sort" /> 32 <ul id="ul1"> 33 <li>34</li> 34 <li>25</li> 35 <li>9</li> 36 <li>88</li> 37 <li>54</li> 38 </ul> 39 </body> 40 </html>
