前端之家收集整理的这篇文章主要介绍了
JS实现点击表头表格自动排序（含数字、字符串、日期），
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
Demo演示地址：
主要的JS代码如下：
添加
for (var i = 0;i < arr.length;i++){
tbody.appendChild(arr[i]);
};
};
//排序
方法
function method(str,a,b){
switch (str){
case 'num': //数字排序
return a-b;
break;
case 'string': //字符串排序
return a.localeCompare(b);
break;
default: //日期排序，IE8下'2012-12-12'这种格式无法设置时间，替换成'/'
return new Date(a.split('-').join('/')).getTime()-new Date(b.split('-').join('/')).getTime();
};
};
JS实现点击表头表格<a href="https://www.jb51.cc/tag/zidong/" target="_blank" class="keywords">自动</a>排序（含数字、字符串、日期）
|
|
|
|
;(function(){
var tbody = document.querySelector('#tableSort').tBodies[0];
var th = document.querySelector('#tableSort').tHead.rows[0].cells;
var td = tbody.rows;
for(var i = 0;i < th.length;i++){
th[i].flag = 1;
th[i].onclick = function(){
sort(this.getAttribute('data-type'),n){
var arr = [];
for(var i = 0;i < td.length;i++){
arr.push(td[i]);
};
arr.sort(function(a,b.cells[n].innerHTML) * flag;
});
for(var i = 0;i < arr.length;i++){
tbody.appendChild(arr[i]);
};
};
function method(str,b){
switch(str){
case 'num':
return a-b;
break;
case 'string':
return a.localeCompare(b);
break;
default:
return new Date(a.split('-').join('/')).getTime()-new Date(b.split('-').join('/')).getTime();
};
};
})();
@H_301_45@
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。
原文链接：https://www.f2er.com/js/42202.html
