开源达人 html+css+js 字母排序的写法。

<p>点击按钮按字母列表排序:</p>
<button onclick="sortList()">排序</button>
<ul id="id01">
  <li>Oslo</li>
  <li>Stockholm</li>
  <li>Helsinki</li>
  <li>Berlin</li>
  <li>Rome</li>
  <li>Madrid</li>
</ul>

<script>
	// list = document.getElementById("id01"); 
	// bb = list.getElementsByTagName("LI");
	//  alert(bb[i].innerHTML.toLowerCase());
	
	function sortList() {
	  //switching = true;  开关
	  //shouldSwitch = true; 应该转换
		  
	  var list, i, switching, b, shouldSwitch;
	  switching = true;
	 
	  //取得UL 获得id
	  list = document.getElementById("id01"); 
	  
	 /*如果为真或为假。做一个循环，循环将持续到 未进行任何切换：*/
	  while (switching) {
	    //首先说：未进行任何切换：
	    switching = false;
		//取得所有的li
	    b = list.getElementsByTagName("li");
	    //循环浏览所有列表项： 因为第1条和其它比较。所以6-1
	    for (i = 0; i < (b.length - 1); i++) {   
	      //首先说，不应进行切换：
	      shouldSwitch = false; 
	      /*检查下一项是否应 使用当前项目切换位置：  Oslo > Stockholm   toLowerCase 转换为小写进行比较   */
		  //  >   则为真   
	      if (b[i].innerHTML.toLowerCase() > b[i + 1].innerHTML.toLowerCase()) {   
	        /*如果下一项的字母顺序低于当前项，标记为开关并断开回路：*/
	        shouldSwitch= true;
	        break;
	      }
	    }
		
	    if (shouldSwitch) {
	      /*如果开关已被标记，则进行更换 并将开关标记为完成：*/
	      b[i].parentNode.insertBefore(b[i + 1], b[i]);
	      switching = true;
	    }
	  }
	}
</script>