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 Archive Network 集合
May 12 Javascript
js 利用className得到对象的实现代码
Nov 15 Javascript
animate动画示例(泪奔的小孩)及stop和delay的使用
May 06 Javascript
选择器中含有空格在使用示例及注意事项
Jul 31 Javascript
jquery中load方法的用法及注意事项说明
Feb 22 Javascript
node.js中的http.response.writeHead方法使用说明
Dec 14 Javascript
深入理解jquery中extend的实现
Dec 22 Javascript
利用Node.js对文件进行重命名
Mar 12 Javascript
详解Vuex管理登录状态
Nov 13 Javascript
深入理解node.js http模块
Jan 24 Javascript
vue iview多张图片大图预览、缩放翻转
Jul 13 Javascript
jstree中的checkbox默认选中和隐藏示例代码
Dec 29 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编写PDF文档生成器
2006/10/09 PHP
摘自织梦CMS中的图片处理类
2015/08/08 PHP
Laravel5.1自定义500错误页面示例
2016/10/09 PHP
js 多种变量定义(对象直接量,数组直接量和函数直接量)
2010/05/24 Javascript
javascript跑马灯悬停放大效果实现代码
2012/12/12 Javascript
重构Javascript代码示例(重构前后对比)
2013/01/23 Javascript
通过JS来判断页面控件是否获取焦点
2014/01/03 Javascript
基于javascript实现图片懒加载
2016/01/05 Javascript
JavaScript实现获取某个元素相邻兄弟节点的prev与next方法
2016/01/25 Javascript
浅析JavaScript作用域链、执行上下文与闭包
2016/02/01 Javascript
JavaScript实现分页效果
2017/03/28 Javascript
vue使用vue-cli快速创建工程
2017/07/28 Javascript
使用jQuery实现鼠标点击左右按钮滑动切换
2017/08/04 jQuery
JavaScript执行环境及作用域链实例分析
2018/08/01 Javascript
解决vue 界面在苹果手机上滑动点击事件等卡顿问题
2018/11/27 Javascript
详解Vue2.5+迁移至Typescript指南
2019/08/01 Javascript
vue3.0中的双向数据绑定方法及优缺点
2019/08/01 Javascript
解决vue单页面修改样式无法覆盖问题
2019/08/05 Javascript
简单了解JavaScript作用域
2020/07/31 Javascript
[05:06]DOTA2-DPC中国联赛 正赛 VG vs Magma选手采访
2021/03/11 DOTA
Python元字符的用法实例解析
2018/01/17 Python
python与sqlite3实现解密chrome cookie实例代码
2018/01/20 Python
解决新版Pycharm中Matplotlib图像不在弹出独立的显示窗口问题
2019/01/15 Python
Python使用scrapy爬取阳光热线问政平台过程解析
2019/08/14 Python
Python循环实现n的全排列功能
2019/09/16 Python
Pytorch实现各种2d卷积示例
2019/12/30 Python
Python 写了个新型冠状病毒疫情传播模拟程序
2020/02/14 Python
python实现从ftp服务器下载文件
2020/03/03 Python
html5指南-7.geolocation结合google maps开发一个小的应用
2013/01/07 HTML / CSS
YSL圣罗兰美妆官方旗舰店:购买YSL口红
2018/04/16 全球购物
印度民族服装购物网站:BIBA
2019/08/05 全球购物
说说你所熟悉或听说过的j2ee中的几种常用模式?及对设计模式的一些看法
2012/05/24 面试题
四年级评语大全
2014/04/21 职场文书
学习教师法的心得体会
2014/09/03 职场文书
水电施工员岗位职责
2015/04/11 职场文书
谢师宴家长致辞
2015/07/27 职场文书