实际案例--关于jquery的对象获取和字符串的截取

一、背景

某个公司的OA管理系统做的数据合计实在不方便，需要手动去计算，相当麻烦，后来打开代码之后，顿时懵逼了！！！

<li>    <div class="aBoxWrapper">        <div class="list_name">            <a href="#courseList_detail_section?id=4f1f659c-b225-4731-a1e1-b740aa6b7470" data-target="section" data-para="{&quot;id&quot;:&quot;4f1f659c-b225-4731-a1e1-b740aa6b7470&quot;}" data-selected="selected">                <span style="margin-right: 5px;">初一一对一（储值标准）赠送_姓名（科目）</span> <span style="display: inline-block;padding: 0 5px;border: 1px solid #ccc;color: #fff;font-size: 12px;border-radius: 2px;background: #ccc;vertical-align: middle;">校区（一对一）</span>                <p style="margin-top: 4px;">教师姓名                    <span>                2017-05-01 08:30~10:30            </span>                </p>            </a>        </div>        <div class="list_record">            <a href="#courseList_record_section?id=4f1f659c-b225-4731-a1e1-b740aa6b7470" data-target="section" data-para="{&quot;id&quot;:&quot;4f1f659c-b225-4731-a1e1-b740aa6b7470&quot;}" data-selected="selected">            1/1            </a>        </div>    </div></li>

懵逼了，这个怎么从中拿数据？而且有的课时取消后，还会多一个span标签，醉了；

想法
鉴于实在不会从人家服务器取数据，没有人家的端口啊，只能复制html代码，来实现功能；
既然需要大量方法来获得数据和处理字符串，我想用jquery最好了，储存数据，对象数组的方式来储存

二、步骤

1.获得需要的元素；

获得最根本a标签

var as = $('.list_name>a');

获得年级和时间

var type = $(as[i]).children().eq(1).text();var date = $(as[i]).children('p').children().text();

2.处理字符串

在上面浪费时间最多的就是处理时间的字符串，不光需要获得日期，时间，还需要获取时间差
2017-05-01 08:30~10:30
现为大家介绍几个我封装的函数

  //获得时间差函数；  function DateMinus(start,end){      var start = new Date(start.replace(/-/g, "/"));  　　var end = new Date(end.replace(/-/g, "/"));  　　var days = end.getTime() - start.getTime();  　　var hours = parseInt(days / (1000 * 60));      hours = hours/60;  　　return hours;  }      //处理日期的函数    function dataHandle(date){        date=date.replace('\n','');        date=date.replace(/\s/g,'');        var dt = date.slice(0,10);        //获得开始时间和结束时间        var start = date.slice(10,15);        var end = date.slice(16);        //计算时间差        var start2 = dt+" "+start;        var end2 = dt+" "+end;        var event = DateMinus(start2,end2);        //返回对象        return {            data : dt,            start : start,            end :end,            event : event        }    }});

后期获得的就是日期、开始时间，结束时间，之间的时间差；

3、建立对象储存数据

var arr = [];for(var i=0;i<as.length;i++){       var type = $(as[i]).children().eq(1).text();       if(type != '已取消'){           var sumName = $(as[i]).children().eq(0).text();           var name = sliceKey(sumName,"_","（英语）");           var grade = textListen(sumName,"试听");           var date = $(as[i]).children('p').children().text();           var dataArr = dataHandle(date);           arr.push({               name : name,               grade : grade,               type : type,               data: dataArr.data,               start : dataArr.start,               end : dataArr.end,               event : dataArr.event           });       }   }        return arr; }

这个是函数的一部分，最后返回新数组，由对象组成，关于sliceKey和textListen函数是处理年级字符串的，比较简单，就没必要给展示了；

4.结尾

获得数据之后，就可以通过模板或者拼接字符串的形式放入到页面中，关于如何获得数据和处理，我是复制ul列表之后，页面中放置一个teatarea标签，粘贴到内部，添加事件即可，具体的就不赘述了，在做的过程中主要是字符串的处理浪费了时间，很有感受，给大家分享一下；