zoukankan      html  css  js  c++  java
  • [Js]表格排序

    思路:遍历每个li,并把它们存放到数组中去,然后通过sort()方法进行排序,再插入

    <body>
        <input type="button" value="排序按钮" id="btn1">
        <ul id="ul1">
            <li>58</li>
            <li>8</li>
            <li>31</li>
            <li>98</li>
            <li>75</li>
        </ul>

    <script type="text/javascript">
        window.onload=function(){
            var oBtn=document.getElementById("btn1");
            var arr=[];
            var oUl=document.getElementById("ul1");
            var aLi=oUl.getElementsByTagName("li");
            var i;
            var bAsc=true;
            oBtn.onclick=function(){
                for(i=0;i<aLi.length;i++){
                    arr[i]=aLi[i];
                }
                arr.sort(function(li1,li2){
                    if(bAsc){
                        return parseInt(li1.innerHTML)-parseInt(li2.innerHTML);
                    }
                    else{
                        return parseInt(li2.innerHTML)-parseInt(li1.innerHTML);
                    }
                });
                for(i=0;i<arr.length;i++){
                    oUl.appendChild(arr[i]);              //appendChild实际上分两步   1.先移除父级 2.添加到新的父级 (添加到原本的父级就相当于把当前元素拿到队列的末尾)
                }
                if(bAsc){
                    bAsc=false;
                }                                        ==>bAsc=!bAsc;    //简化写法
                else{
                    bAsc=true;
                }
            };
        }
    </script>
    </body>

  • 相关阅读:
    js 获取时间差
    linq 两个list合并处理,并分组
    单例模式 双锁
    2018年的读书清单
    感悟
    asp.net使用Microsoft.mshtml提取网页标题等解析网页
    //利用反射快速给Model实体赋值
    C# url接口调用
    多字段动态查询
    对图片的操作
  • 原文地址:https://www.cnblogs.com/zhangwenkan/p/3755430.html
Copyright © 2011-2022 走看看