html表格按照编号排序,JS实现简单表格排序操作示例

本文实例讲述了JS实现简单表格排序操作。分享给大家供大家参考，具体如下：

sort table

margin:0px;

padding:0px;

}

body{

background:#ccc;

}

table{

width:350px;

margin:0 auto;

background-color:#eee;

}

table th{

cursor:hand;

padding:5px 0;

background-color:#999;

}

table td{

background-color:#fff;

font-size:16px;

font-weight:normal;

text-align:center;

line-height:30px;

}

function sortCells(type){

var tbs=document.getElementsByTagName("table")[0];

var arr=[];

var arr2=[];

for(var i=1;i

var text=tbs.rows[i].cells[type].innerText;

arr.push(text);

arr2[text]=i;

}

if(type==0){

arr.sort(function(a,b){return a-b});

}else{

arr.sort();

}

var temp="";

for(var j=1;j

temp=tbs.rows[j].cells[0].innerText;

tbs.rows[j].cells[0].innerText=tbs.rows[arr2[arr[j-1]]].cells[0].innerText;

tbs.rows[arr2[arr[j-1]]].cells[0].innerText=temp;

temp=tbs.rows[j].cells[1].innerText;

tbs.rows[j].cells[1].innerText=tbs.rows[arr2[arr[j-1]]].cells[1].innerText;

tbs.rows[arr2[arr[j-1]]].cells[1].innerText=temp;

temp=tbs.rows[j].cells[2].innerText;

tbs.rows[j].cells[2].innerText=tbs.rows[arr2[arr[j-1]]].cells[2].innerText;

tbs.rows[arr2[arr[j-1]]].cells[2].innerText=temp;

// console.log(arr2);

for(var i=1;i

var text=tbs.rows[i].cells[type].innerText;

arr2[text]=i;

}

sort table

序号	姓名	日期
2	BB	2015-09-12
3	CC	2015-07-12
1	AA	2015-09-11
4	DD	2015-06-12

运行效果：

希望本文所述对大家JavaScript程序设计有所帮助。

html表格按照编号排序,JS实现简单表格排序操作示例相关推荐

《大话数据结构》第9章排序 9.4 简单选择排序
9.4.1 简单选择排序算法爱炒股票短线的人,总是喜欢不断的买进卖出,想通过价差来实现盈利.但通常这种频繁操作的人,即使失误不多,也会因为操作的手续费和印花税过高而获利很少.还有一种做股票的人,他们 ...
java 排序原理_简单选择排序算法原理及java实现（超详细）
简单选择排序的原理简单选择排序的原理非常简单,即在待排序的数列中寻找最大(或者最小)的一个数,与第 1 个元素进行交换,接着在剩余的待排序的数列中继续找最大(最小)的一个数,与第 2 个元素交换.以 ...
排序算法：简单选择排序算法实现及分析
简单选择排序算法介绍简单选择排序(Simple Selection Sort)就是通过n-1次关键字排序之间的比较,从n-i+1个记录中选择关键字最小的记录,并和第i(1<=i<=n)记 ...
html怎么自动导入数据并排序,JS实现table表格数据排序功能(可支持动态数据+分页效果)...
asp.net会经常遇到分页的效果,尤其是希望实现静态的html分页排序(html分页相信大家都已经有自己的解决方案.在这里就不多说).我写了一个简单的Demo排序. 数据就是字母和数字两组.(汉字需 ...
数据结构（八）：排序 | 插入排序 | 希尔排序 | 冒泡排序 | 快速排序 | 简单选择排序 | 堆排序 | 归并排序 | 基数排序 | 外部排序 | 败者树 | 置换-选择排序 | 最佳归并树
文章目录第八章排序一.排序的基本概念 (一)什么是排序 (二)排序的应用 (三)排序算法的评价指标 (四)排序算法的分类 (五)总结二.插入排序 (一)算法思想 (二)算法实现 (三)算法效率 ...
html表格鼠标高亮行列,JS实现的表格行鼠标点击高亮效果代码
本文实例讲述了JS实现的表格行鼠标点击高亮效果代码.分享给大家供大家参考,具体如下: 偶尔在看天天基金网净值公告时,从源代码里剥下的一段js代码,感觉比较实用,分享一下(仅IE有效) var high ...
两种选择排序算法：简单选择排序、堆排序
一.简单选择排序空间复杂度:O(1) 时间复杂度:O(n^2) 稳定性:不稳定适用性:顺序表.链表 //简单选择排序 void SelectSort(int A[],int n){for(i=0; ...
排序算法-05简单选择排序（python实现）
简单选择排序概述顾名思义,这是一种选择排序. 其步骤大致是,每一趟排序从待排记录中找到一个最小的关键字,放到已排序记录末尾,知道排序结束. 算法详解首先,从待排记录中找到最小元素如果最小元素不 ...
使html表格可编辑状态,js+Html实现表格可编辑操作
本文实例为大家分享了js+Html实现表格可编辑操作的具体代码,供大家参考,具体内容如下功能描述:单击页面使单元格td变成可编辑状态,输入内容后,当单元格失去焦点时,保存输入的内容. 点击增加行,在 ...

html表格按照编号排序,JS实现简单表格排序操作示例

html表格按照编号排序,JS实现简单表格排序操作示例相关推荐

最新文章

热门文章