HTML代码
<ol id="test-list">
<li class="lang">Scheme</li>
<li class="lang">JavaScript</li>
<li class="lang">Python</li>
<li class="lang">Ruby</li>
<li class="lang">Haskell</li>
</ol>
JS代码
第一种解法：
利用insertBefore方法进行插入 较小的插入到较大的前面
var new_list = document.getElementById('test-list');
var new_list_child = document.getElementsByClassName('lang');
for(var i=0;i<new_list_child.length;i++){
for(var j = i+1;j<new_list_child.length;j++){
if(new_list_child[i].innerText > new_list_child[j].innerText){
new_list.insertBefore(new_list_child[j],new_list_child[i])
}
}
}
第二种解法：
通过 Array.protptype.slice.call().sort() 转换数组 进行排序 forEach循环遍历进行重新添加节点
var new_list = document.getElementById('test-list');
var new_list_child = new_list.children;
new_list_child = Array.prototype.slice.call(new_list_child).sort(function(a,b){
return a.innerHTML > b.innerHTML?1:-1;
})
new_list_child.forEach(function(el){
new_list.appendChild(el);
})
注：代码更新之后发现 存在只适用于同样大小写的情况，也就是说大写之间进行排序，小写之间进行排序，如果混在一起的话，例如：AfBcdE 结果为ABEcdf 这个问题后面我会注意改过来重新追加
