>  기사  >  웹 프론트엔드  >  테이블 정렬 의 다양한 필드를 구현하는 JS 메서드

테이블 정렬 의 다양한 필드를 구현하는 JS 메서드

一个新手
一个新手원래의
2017-10-02 09:43:581173검색

<table id="tableSort">
    <thead>
        <tr>
            <th data-type="num">工号</th>
            <th data-type="string">姓名</th>
            <th data-type="string">性别</th>
            <th data-type="date">时间</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>06</td>
            <td>sssss</td>
            <td>男</td>
            <td>2008-10-10</td>
        </tr>
        <tr>
            <td>07</td>
            <td>ddddd</td>
            <td>男</td>
            <td>2009-10-10</td>
        </tr>
        <tr>
            <td>11</td>
            <td>qqqqq</td>
            <td>男</td>
            <td>2010-10-10</td>
        </tr>
        <tr>
            <td>02</td>
            <td>vvvvv</td>
            <td>男</td>
            <td>2011-10-10</td>
        </tr>
        <tr>
            <td>11</td>
            <td>hhhhh</td>
            <td>男</td>
            <td>2011-12-10</td>
        </tr>
        <tr>
            <td>01</td>
            <td>eeeee</td>
            <td>女</td>
            <td>2015-10-10</td>
        </tr>
        <tr>
            <td>09</td>
            <td>mmmmm</td>
            <td>女</td>
            <td>2015-11-10</td>
        </tr>
    </tbody></table>

3f1c4e4b6b16bbbd69b2ee476dc4f83a 
    var th = document.querySelector("#tableSort").tHead.rows[0].cells;
    var tbody = document.querySelector("#tableSort").tBodies[0];
    var td = tbody.rows;
    for(var i=0;
    ica1e32101bf07ea7732bfcc0a33ebf2a
对于sort()排序方法。里面可以自定义小编觉得还是挺灵活的 arr.sort((a,b) => a-b) 针对number类型,
arr.sort((a,b) => a.localeCompare(b))这波能反杀,针对string类型作比较 可返回(1,0,-1)三个选项,
1,0,-1的先后顺序,由于小编记忆力极差,刚看就忘了,请大家自行百度

위 내용은 테이블 정렬 의 다양한 필드를 구현하는 JS 메서드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.