html中table数据排序的js代码


Posted in Javascript onAugust 09, 2011

对了,注意那个innerText和innerHTML

function sortCells(event) { 
var obj = event.target; 
var count = 0; count是记录点击次数的,根据奇偶进行升序或降序 
if(!obj.getAttribute("clickCount")){ 
obj.setAttribute("clickCount", 0); 
} else { 
count = parseInt(obj.getAttribute("clickCount")); 
count++; 
obj.setAttribute("clickCount", count); 
} 
var table = event.target.parentNode.parentNode; 
if(table.nodeName.localeCompare("THEAD") == 0){ 
if(table.parentNode.nodeName.localeCompare("TABLE") == 0){ 
table = table.parentNode; 
} else { 
return; 
} 
} else if(table.nodeName.localeCompare("TBODY") == 0){ 
if(table.parentNode.nodeName.localeCompare("TABLE") == 0){ 
table = table.parentNode; 
} else { 
return; 
} 
} else if(table.nodeName.localeCompare("TABLE") == 0){ 
} else { 
return; 
} 
var colNum; 
for(x = 0; x < table.rows(1).cells.length; x++){ 
if(event.target.innerText.localeCompare(table.rows(0).cells[x].innerText) == 0){ 
colNum = x; 
break; 
} 
} 
var column = table.rows(1).cells.length; 
var row = table.rows.length; 
var Ar = new Array(row - 1); 
for (x = 0; x < row - 1; x++) { 
Ar[x] = new Array(column); 
} 
for (x = 1; x < row; x++) { 
for (y = 0; y < column; y++) { 
Ar[x - 1][y] = table.rows(x).cells(y).innerHTML; 
} 
} 

 //这个可以对字符串进行本地化排序 
/* if((count%2) == 0){ 
Ar.sort(function(a, b) { 
return b[colNum].localeCompare(a[colNum]) 
}); 
} else { 
Ar.sort(function(a, b) { 
return a[colNum].localeCompare(b[colNum]) 
}); 
} */ 
var temp; 
for (x = 0; x < row - 1; x++) { 
for (y = 1; y < row - 1; y++) { 
temp = Ar[y - 1]; 
if((count % 2) == 0){ 
if (parseInt(Ar[y - 1][colNum]) >= parseInt(Ar[y][colNum])) { 
Ar[y - 1] = Ar[y]; 
Ar[y] = temp; 
} 
} else { 
if (parseInt(Ar[y - 1][colNum]) <= parseInt(Ar[y][colNum])) { 
Ar[y - 1] = Ar[y]; 
Ar[y] = temp; 
} 
} 
} 
} 
for (x = 1; x < row; x++) { 
for (y = 0; y < column; y++) { 
table.rows(x).cells(y).innerHTML = Ar[x - 1][y]; 
} 
} 
count++; 
}
Javascript 相关文章推荐
JavaScript获得选中文本内容的方法
Dec 02 Javascript
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
Nov 14 Javascript
ASP.NET中基于JQUERY的高性能的TreeView补充
Feb 23 Javascript
给artDialog 5.02 增加ajax get功能详细介绍
Nov 13 Javascript
JavaScript去除空格的三种方法(正则/传参函数/trim)
Feb 06 Javascript
解析URI与URL之间的区别与联系
Nov 22 Javascript
javascript实现树形菜单的方法
Jul 17 Javascript
js实现鼠标拖拽多选功能示例
Aug 01 Javascript
es6在react中的应用代码解析
Nov 08 Javascript
IE11下处理Promise及Vue的单项数据流问题
Jul 24 Javascript
微信小程序开发搜索功能实现(前端+后端+数据库)
Mar 04 Javascript
vue集成openlayers加载geojson并实现点击弹窗教程
Sep 24 Javascript
最常用的12种设计模式小结
Aug 09 #Javascript
silverlight线程与基于事件驱动javascript引擎(实现轨迹回放功能)
Aug 09 #Javascript
javascript 主动派发事件总结
Aug 09 #Javascript
JsDom 编程小结
Aug 09 #Javascript
IE 当eval遇上function的处理
Aug 09 #Javascript
取得窗口大小 兼容所有浏览器的js代码
Aug 09 #Javascript
Javascript实现的类似Google的Div拖动效果代码
Aug 09 #Javascript
You might like
PHP原理之异常机制深入分析
2010/08/08 PHP
php中session退出登陆问题
2014/02/27 PHP
PHP实现批量修改文件后缀名的方法
2015/07/30 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
thinkphp中AJAX返回ajaxReturn()方法分析
2016/12/06 PHP
Laravel中的Blade模板引擎示例详解
2017/10/10 PHP
syntaxhighlighter 使用方法
2007/07/02 Javascript
js 实现图片预加载(js操作 Image对象属性complete ,事件onload 异步加载图片)
2011/03/25 Javascript
jquery cookie的用法总结
2013/11/18 Javascript
javascript实现按回车键切换焦点
2015/02/09 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
JavaScript之数组(Array)详解
2015/04/01 Javascript
跟我学习javascript的闭包
2015/11/16 Javascript
JavaScript DOM 学习总结(五)
2015/11/24 Javascript
纯js代码制作的网页时钟特效【附实例】
2016/03/30 Javascript
AngularJS入门教程之表格实例详解
2016/07/27 Javascript
js实现移动端微信页面禁止字体放大
2017/02/16 Javascript
ES6中Iterator与for..of..遍历用法分析
2017/03/31 Javascript
ES5学习教程之Array对象
2017/04/01 Javascript
JavaScrip数组删除特定元素的几种方法总结
2017/09/06 Javascript
Vue中img的src是动态渲染时不显示的解决
2019/11/14 Javascript
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
2020/09/22 Javascript
用webAPI实现图片放大镜效果
2020/11/23 Javascript
Python Sleep休眠函数使用简单实例
2015/02/02 Python
Python中str.format()详解
2017/03/12 Python
详解python实现线程安全的单例模式
2018/03/05 Python
Python打包方法Pyinstaller的使用
2018/10/09 Python
pandas 把数据写入txt文件每行固定写入一定数量的值方法
2018/12/28 Python
Pandas 缺失数据处理的实现
2019/11/04 Python
TensorFlow tensor的拼接实例
2020/01/19 Python
Python matplotlib绘制图形实例(包括点,曲线,注释和箭头)
2020/04/17 Python
python装饰器代码深入讲解
2021/03/01 Python
CSS3让登陆面板3D旋转起来
2016/05/03 HTML / CSS
数据库测试通常都包括哪些方面
2015/11/30 面试题
电子商务专业学生职业生涯规划
2014/03/07 职场文书
党员公开承诺书
2014/03/25 职场文书