<html>
    <head>
    <title>Table Sort Example</title>
        <script type="text/javascript">
        //比较函数,比较两个行
        function compareTRs(oTR1,oTR2)
        {
            var sValue1 = oTR1.cells[0].firstChild.nodeValue;
            var sValue2 = oTR2.cells[0].firstChild.nodeValue;
            return sValue1.localeCompare(sValue2);
        }
        function sortTable(sTableID) {
                var oTable = document.getElementById(sTableID);
                var oTBody = oTable.tBodies[0];//找到body
                var colDataRows = oTBody.rows;//获取所有的行
                var aTRs = new Array;                for (var i=0; i < colDataRows.length; i++) {
                    aTRs[i] = colDataRows[i];
                }
                //把所有的行的引用放到数组中,然后排序
                aTRs.sort(compareTRs);
                //调用排序函数
                var oFragment = document.createDocumentFragment();//创建文档碎片,更快的重新组织DOM
                for (var i=0; i < aTRs.length; i++) {
                    oFragment.appendChild(aTRs[i]);
                }                oTBody.appendChild(oFragment);
            }        </script>
    </head>    <body>
        <p>Click on the table header to sort in ascending order.</p>
        <table border="1" id="tblSort">
            <thead>
                <tr>
                    <th onclick="sortTable('tblSort')" style="cursor:pointer">Last Name</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>中国</td>
                </tr>
                <tr>
                    <td>突围</td>
                </tr>
                <tr>
                    <td>贪污</td>
                </tr>
                <tr>
                    <td>我们</td>
                </tr>
                <tr>
                    <td>阿姨</td>
                </tr>
                <tr>
                    <td>Walker</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>