WEB前端题集解答（2）

下面的题目来自淘宝,稍微做了下改动

下面是一个网友积分列表，请用Javascirpt将列表积分从高到低重新排序，

<ul id="score">
 	<li>小王<em>70</em></li>
	<li>小李<em>68</em></li>
	<li>小张<em>80</em></li>
	<li>小四<em>50</em></li>
	<li>小五<em>40</em></li>
	<li>小六<em>30</em></li>
 </ul>

解决方案：首先要获得积分元素集合，即em元素集合； 获得之后要对集合进行排序，单对元素集合进行排序可要苦死，可以将其转化为数组，利用数组的特性进行排序；最后将排序好的数组元素重新接到ul上。

代码如下：

function NodeListToArray(list){
    var elems = [];
    try {
        elems = Array.prototype.slice.call(list, 0);
     } 
     catch (e) {/*For IE*/
        for (var i = 0, len = list.length; i < len; ++i) {
             elems.push(list[i]);
         }
     }
     return elems;
}
            
window.onload = function(){
      /*比较函数*/
      var scoreCompare = function(elem1, elem2){
           return parseInt(elem2.firstChild.nodeValue) - parseInt(elem1.firstChild.nodeValue);
       };
                
       var list = document.getElementById('score'), 
			ems = list.getElementsByTagName('em'), 
			elems = null;
                
        /*获得em元素数组*/
        elems = NodeListToArray(ems);
        /*对em元素数组排序*/
        elems.sort(scoreCompare);
        /*按顺序连接到ul节点之后，这里注意下appendChild的妙处，若节点已经存在于文档上，
         *则appendChild会将节点从原来的位置删除，接在新的位置上，而不用把原来节点复制，移除，再添加*/
        for (var i = 0, len = elems.length; i < len; ++i) {
           list.appendChild(elems[i].parentNode);
         }
};

以下是个人认为的考点和家分点：

考点1：能否利用JS内置对象的特性提高性能；这里用到了Array对象

考点2：appendChild函数的特点；若节点已经存在于文档上，则appendChild会将节点从原来的位置删除，接在新的位置上

应注意的细节：数字字符串的比较，'2'是比'12'大的，所以不应该简单的比较字符串，应该将其转化为数字再进行比较

加分项：利用call调用原生内置方法，知道IE下DOM元素与其他浏览器的实现不同（IE下是COM实现的，所以内置的数组方法没法对其使用，这个是书上看的，我只是搬来说说，当然结论就是，IE下对NodeList调用数组的内置方法会出错）。