原生JS实现的JSON数组排序，关键字锚点跳转到指定内容区

原生JS实现的仿点击锚点对应模块跳转到指定的位置，锚点关键字从模块中取出，去除重复值按照由大到小的顺序排序
//JSON数组按指定值进行排序排序,name:排序规则
        function jsonSort(jsonarr,name,snum){
            //如果数组<=1,则直接返回
            if(jsonarr.length<=1){return jsonarr;}
            var pivotIndex=Math.floor(jsonarr.length/2);
            //找基准，并把基准从原数组删除
            var pivot=jsonarr.splice(pivotIndex,1)[0];
            var middleNum=pivot[name];
            // 定义左右数组
            var leftArr=[];
            var rightArr=[];
            //比基准小的放在left，比基准大的放在right
            if(snum){
                for(var i=0;i<jsonarr.length;i++){
                    if(Number(jsonarr[i][name])<=Number(middleNum) ){
                        leftArr.push(jsonarr[i]);
                    }else{
                        rightArr.push(jsonarr[i]);
                    }
                }
            }else{
                for(var i=0;i<jsonarr.length;i++){
                    if(jsonarr[i][name]<=middleNum){
                        leftArr.push(jsonarr[i]);
                    }else{
                        rightArr.push(jsonarr[i]);
                    }
                }
            }
            //递归,返回所需数组,从大到小的顺序排列
            return jsonSort(rightArr,name,snum).concat([pivot],jsonSort(leftArr,name,snum));
        }

        function Id(id){
            return document.getElementById(id);
        }
        //加载列表数据
        function getData(ListData){
            var detailbox = Id("detailbox");
            var detailHtml = "";
            var dataM = []; //存放当前年月的值
            for(var i=0;i<ListData.length;i++){
                //ListData[i].expiry.substr(0,7)取出年月，对指定字符串从0开始取出7个字符
                detailHtml+="<li id='"+ListData[i].id+"' data-month='"+ListData[i].datatime.substr(0,7)+"'>"+
                        "<div>"+
                        "<h3>"+ListData[i].detail+"</h3>"+
                        "<p>"+ListData[i].datatime+"</p>"+
                        "</div>"+
                        "</li>";
                detailbox.innerHTML = detailHtml;
                dataM.push(ListData[i].datatime.substr(0,7));
            }           
            var monthArr = unique(dataM);
            getTimeline(monthArr);
        }

        //数组去重
        function unique(arr) {
            var result = [], hash = {};
            for (var i = 0, elem; (elem = arr[i]) != null; i++) {
                if (!hash[elem]) {
                    result.push(elem);
                    hash[elem] = true;
                }
            }
            return result;
        }

        //加载时间线数据
        function getTimeline(timedata){
            var timeline = Id("timeline");
            var timeHtml="";
            for(var i=0;i<timedata.length;i++){
                timeHtml+="<li><a href='javascript:;'>"+timedata[i]+"</a></li>";
                timeline.innerHTML = timeHtml;
            }
        }

        //获取时间线的值
        function gotoDetail(){
            var timeUl = Id("timeline");
            timeUl.onclick = function(ev){
                var ev = ev || window.event;
                var target = ev.target || ev.srcElement;
                if(target.nodeName.toLowerCase() == 'a'){                    
                    var timeText = target.innerHTML;
                    getDMonth(timeText);
                }
            }
        }

        //点击时间线，页面将跳转到指定的内容
        function getDMonth(timeText){
            var dmonthArr = [];
            var detailLisArr = [];
            var detailbox = Id("detailbox");
            var detailLis=detailbox.getElementsByTagName("li");
            for (var i=0; i< detailLis.length;i++){
                if(detailLis[i].getAttribute("data-month")==timeText){                    
                    detailLisArr.push(detailLis[i]);
                }
            }         
            document.documentElement.scrollTop = document.body.scrollTop = detailLisArr[0].offsetTop;
        }
window.onload = function(){
            var ListData=[
                {"id":"1","detail":"JS Array.reverse 将数组元素颠倒顺序","datatime":"2018-01-12 15:20"},
                {"id":"2","detail":"js for循环倒序输出数组元素","datatime":"2018-01-26 9:10"},
                {"id":"3","detail":"使用js实现数组逆序","datatime":"2018-01-05 11:20"},
                {"id":"4","detail":"js中数组的排序","datatime":"2017-10-02 8:20"},
                {"id":"5","detail":"js中数组的sort()方法用法，参数以及排序原理","datatime":"2017-10-19 15:45"},
                {"id":"6","detail":"Javascript 数组循环遍历之forEach","datatime":"2017-10-23 15:32"},
                {"id":"7","detail":"js数组的sort排序详解","datatime":"2016-09-14 15:20"},
                {"id":"8","detail":"Js数组排序函数sort()介绍","datatime":"2016-09-30 15:20"},
                {"id":"9","detail":"JVM启动参数的类别及使用","datatime":"2016-06-29 15:12"},
                {"id":"10","detail":"2018年，该转行AI工程师吗","datatime":"2015-12-24 15:20"},
                {"id":"11","detail":"vue: WebStorm设置快速编译运行","datatime":"2017-12-12 11:20"},
     
4000
          {"id":"12","detail":"编程到底难在哪里？","datatime":"2015-12-09 10:20"},
                {"id":"13","detail":"android跨进程通信（IPC）：使用AIDL","datatime":"2017-12-05 12:30"},
                {"id":"14","detail":"想精通 Python 数据挖掘？清华博士带你入门！","datatime":"2016-06-12 09:00"},
                {"id":"15","detail":"大龄程序员都去哪了？","datatime":"2015-07-13 22:15"}
            ];
   //按照日期返回的排序数组
            var arrListData = jsonSort(ListData,"datatime",false);
            getData(arrListData);
            gotoDetail();
        }
<!--HTML -->
<div class="box_l">
    <ul id="detailbox">
        <li data-month="2017-5">
            <div>
                <h3></h3>
                <p></p>
            </div>
        </li>
    </ul>
</div>
<div class="box_r">
    <ul id="timeline">
        <li><a href="javascript:;"></a></li>
    </ul>
</div>
<!--效果-->