本文實例講述了jQuery實現(xiàn)對無序列表的排序功能。分享給大家供大家參考，具體如下：
利用jQuery對無序列表排序的原理是：獲取到無序列表中的所有列表項，并轉(zhuǎn)成數(shù)組形式，使用JavaScript函數(shù)對其進行排序后再次輸出。其中使用到的jQuery函數(shù)有ready()、get()、text()、each()、append()和JavaScript函數(shù)sort()。
1．jQuery函數(shù)介紹
（1）jQuery函數(shù)get()--獲取匹配元素集合
該函數(shù)取得所有匹配元素的一種向后兼容的方式（不同于jQuery對象，實際上是元素數(shù)組）。其語法形式如下：
object.get()
注：如果你想要直接操作DOM對象而不是jQuery對象，這個函數(shù)非常有用。
（2）jQuery函數(shù)text()--獲取和設置元素內(nèi)容
該函數(shù)獲取和設置匹配元素的文本內(nèi)容。其語法形式如下：
object.text([val|fn])
注：val和fn參數(shù)可選。val是設置元素的文本內(nèi)容值；fn(index,text)函數(shù)返回一個字符串，接受兩個參數(shù)，index為元素在集合中的索引位置，text為原先的text值。
（3）jQuery函數(shù)append()--向元素追加內(nèi)容
該函數(shù)向每個匹配的元素內(nèi)部追加內(nèi)容。其語法形式如下：
object.append(content|fn)
注：這個操作與對指定的元素執(zhí)行appendChild方法并將它們添加到文檔中的情況類似。content參數(shù)表示追加的內(nèi)容；fn(index,html)返回一個HTML字符串，用于追加到每一個匹配元素內(nèi)部，接受兩個參數(shù)，index參數(shù)為對象在這個集合中的索引值，html參數(shù)為這個對象原先的html值。
2．JavaScript函數(shù)介紹
JavaScript函數(shù)sort()--元素排序，用于對數(shù)組元素進行排序。其語法形式如下：
arrayObject.sort([sortby])
注：sortby可選，規(guī)定排列順序，必須是函數(shù)。返回值為排序后的數(shù)組本身。如果調(diào)用該方法時沒有使用參數(shù)，將按字母順序?qū)?shù)組中的元素進行排序。說得更精確點，是按照字符編碼的順序進行排序。要實現(xiàn)這一點，首先應把數(shù)組的元素都轉(zhuǎn)換成字符串（如有必要），以便進行比較。
如果想按照其他標準進行排序，就需要提供比較函數(shù)，該函數(shù)要比較兩個值，然后返回一個用于說明這兩個值的相對順序的數(shù)字。比較函數(shù)應該具有兩個參數(shù)a和b，其返回值如下：若a小于b，在排序后的數(shù)組中a應該出現(xiàn)在b之前，則返回一個小于0的值。若a等于b，則返回0。若a大于b，則返回一個大于0的值。
3．功能實現(xiàn)
實現(xiàn)無序列表項排序功能的步驟如下。
（1）獲取所有的列表項，并將其裝入數(shù)組。
（2）對數(shù)組對象進行排序。
（3）將排好序的數(shù)組重新填充到無序列表中。
首先，把jQuery庫引入進來：
<script language="JavaScript" src="jquery-1.7.2.min.js"></script>
然后，添加如下排序功能代碼：
<script language="JavaScript" type="text/JavaScript">
$(document).ready(function(){
var items = $(".orderobj li").get(); //獲取所有待排序li裝入數(shù)組items
items.sort(function(a,b) //調(diào)用JavaScript內(nèi)置函數(shù)sort
{
var elementone = $(a).text();
var elementtwo = $(b).text();
if(elementone < elementtwo) return -1;
if(elementone > elementtwo) return 1;
return 0;
});
var ul = $(".orderobj");
$.each(items,function(i,li)
//通過遍歷每一個數(shù)組元素，填充無序列表
{
ul.append(li);
});
});
</script>
希望本文所述對大家jQuery程序設計有所幫助。