用文本、数字或日期对表格或元素进行排序的方法。

本文给出了Javascript通过文本、数字或日期对表格或元素进行排序的方法,供大家参考,具体实现方法如下:


按文本编号或日期正确地对表格列进行排序。还有其他的
插件,等等,对于这个,但是它们都被限制在特定的范围内。
或者要求有日期格式,每个行元素都有一个排序属性;我的。
可以处理许多不同的日期和数字格式,甚至允许特定的
可能不符合该列的全部日期数字格式的单元格。
我的版本还允许对元素层次结构进行排序:例如包含一个div
p-paragraphs和跨越这可能/甚至含有价格图片库
或跨度内的日期。非常有效!!
例如: / / /安得烈。DX。是sortgallerydel.html
addsorttotables(将); / /使表格标题点击,排序的列
或降 / /升class=sortit 任何表秩序。
/ / sorttable(TBL、Col);将排序表(表是一个ID或表对象)
以升序或降序提供的列索引(从0中索引)。
/ / addsortbydate(TBL,COL,datemask);可以按日期列排序,
由一个日期面膜如 / / 'dd-mmm-yy指定的。
/ / addsortbynumber(TBL、Col);使用编号列排序。这是假设
作为小数点/ 周期。分隔符(如果存在);它忽略任何其他非数字。
字符。
/ / sortelements(parentel,childtag,coltag,colindex);将排序(非表格)
升序或降序排列的元素。例如,包含LIs的UL
跨越。colindex指定的跨度/排序可能有多个;
(0索引)。
例如: / sortelements('divid,'p','span ',2);
每个段落内的跨度。第三

/ / addsortbydate2(parentel,childtag,coltag,colindex,datemask);和
/ / addsortbynumber2(parentel,childtag,coltag,colindex)
提供相同的功能集为addsortbydate / addsortbynumber呢
但是对于表,元素层次结构。
如果某个列(或元素)中有日期或数字不符合
正确排序的日期掩码或数字格式,那么这些个人
可以给属性元素和排序,他们仍然正确排序!
例如,使用日期栏仍然会排序
Cell correctly. (本格式/ 'yyyy /毫米/ dd'will被转换成一个日期(对象。))
无功monthnames = {一月
八月
无功daynames = {星期日
星期五
无功shortmths = {简
SEP
无功shortdays = {太阳
VaR AddEvent =功能(元素、事件类型、函数){
助手函数。
如果(元素。addEventListener)
AddEvent =功能(元素、事件类型、函数){
elem.addeventlistener(事件类型、功能、假);
};
如果(元素。attachevent)
AddEvent =功能(元素、事件类型、函数){
elem.attachevent(开+事件类型、功能);
};
其他的
AddEvent =功能(元素、事件类型、函数){
元素{开} =功能+事件类型;
};
AddEvent(元素、事件类型、功能);
};
方法/算法训练归结: / /排序
无功sorttable =功能(TBL,COL){
被直接调用
sortelements(TBL,TR,'td ',Col);
};
无功sortelements =功能(parentel,childtag,coltag,colindex){
/ /例子:SortElements('table1,TR,'td ',2)
或/ sortelements('list1 '李')
或/ sortelements('divname,'p','span ',3)
var i,j,ctags = {},从头= 0,childlen、孩子、元素,
SortBy,内容,elems = sortedlen,破片,{ },hdrslen,HDR;
VaR母(typeof = parentel = 'String')
document.getelementbyid(parentel):parentel;
Var AscText =(A,B)排序功能(通过){ / /数据为文本。
var x = y = b.data a.data,
xnum = parseFloat(x),ynum = parseFloat(Y);
检查每个开始时是否有一个…
如果(!IsNaN(xnum)!IsNaN(ynum)(xnum - ynum))
返回xnum - ynum;
返回((x y)1:0);
};
无功desctext =功能(A,B)(的数据){ / /排序
var x = y = b.data a.data,
xnum = parseFloat(x),ynum = parseFloat(Y);
检查每个开始时是否有一个…
如果(!IsNaN(xnum)!IsNaN(ynum)(ynum - xnum))
返回ynum - xnum;
返回((x - y)- 1:((x y)1:0));
};
Var AscNum =(A,B)功能使用日期以及{ / /
返回a.data - b.data;
};
无功descnum =功能(A,B){
返回b.data - a.data;
};
(如果)(parent.nodename.tolowercase = = }}){
如果(childtag = = TR){
sortBy =母。行{ 0 } { }。细胞colindex sortby'text | |;
}
Parent = parent.tBodies{0} parent ||;
(如果)(母行{ 0 }。细胞{ 0 }。nodename.tolowercase = = 'th){
开始= 1;
}
}
标签= parent.getelementsbytagname(childtag);
如果(typeof colindex = = 'undefined){
sortBy =中的排序列表或段落;简单 / /文
}
对(我=开始,childlen = ctags.length;i < childlen;i++){
检查每个孩子的前进方向。
孩子=标签{我};
elem =(coltag)achild.getelementsbytagname(coltag){ }:孩子colindex;
如果(元){
(如果!SortBy){ / /排序非表列..
sortBy =(typeof elem.numbervalue!= 'undefined '数'):
((typeof elem.datevalue!='undefined')'date':'text');
}
开关(sortBy){
你可以supply'sort'attributes /启用排序数字,等。
日期示例。。
case'text:
内容=(elem.getattribute(大概的)| |
元素节点)。第一个孩子,ToLowerCase();
打破;
case'number:
内容= elem.numbervalue;
打破;
case'date:
内容= elem.datevalue;
打破;
违约:
内容=(elem.getattribute(大概的)| |
元素节点)。第一个孩子,ToLowerCase();
打破;
}
J = elems.length;
如果(!AChild。ID)
AChild.id ='tempSortID'+ J;
艾丽美{ } = { {J}.数据:内容,tempid:孩子身份证};
}
}
下面将确定是否已对表等进行排序
在同一列或标签上。如果这样的话,它会升序或降序排序。
秩序。它向父元素创建自定义元素属性
以前的排序细节。 /记住
如果(typeof colindex = = 'undefined)colindex = 0;
如果(parent.prevtag = parent.prevtag(typeof(coltag = 'undefined)
ChildTag:coltag)){
如果(parent.prevcol = = colindex){
按同一列进行排序
parent.prevsort =(parent.prevsort = = 'asc)'desc:'asc;
}其他列的排序
parent.prevcol = colindex;
parent.prevsort = 'asc;
}
{人}
排序第一次或通过不同的标记
((parent.prevtag =类型= = coltag 'undefined)childtag:coltag);
parent.prevcol = colindex;
parent.prevsort = 'asc;
}
如果(parent.prevsort = 'desc){
desc'will是以前那种 / /订单..
开关(sortBy){
case'text:elems.sort(desctext);突破;
case'number:elems.sort(descnum);突破;
case'date:elems.sort(descnum);突破;
默认值:elems.sort(desctext);突破;
}
{人}
开关(sortBy){
case'text:elems.sort(asctext);突破;
case'number:elems.sort(ascnum);突破;
case'date:elems.sort(ascnum);突破;
默认值:elems.sort(asctext);突破;
}
}
片段= document.createdocumentfragment();
为(i = 0,sortedlen = elems.length;i < sortedlen;i++){
elem = document.getelementbyid(elems {我}。tempid);
frag.appendchild(元);
如果((元。ID)。Substr(0,10)= 'tempsortid)
elem.removeattribute('id');
}
parent.appendchild(片段);
艾丽美= null;
返回parent.prevsort; / /没用
};
无功addsorttotables =函数(){()
表class-name'sortit ' / / ..如果
无功表= document.getelementsbytagname(}}),I,J,
tbllen,TBL,HDRS,hdrslen;
函数的PreserveSortScope(A,B,C,D){
返回函数(){
分配sortelements FN。到一个表表头
sortelements(A,B,C,D);
}
}
排序到表头
为(i = 0,tbllen = tables.length;i < tbllen;i++){
TBL =表{我};
如果(tbl.classname.indexof('sortit ')+ 1){
HDRS = tbl.getelementsbytagname('th);
如果(HDRS){
为(J = 0,hdrslen = hdrs.length;J < hdrslen;j++){
AddEvent(HDRS { J },听到咔哒声,PreserveSortScope(TBL,TR,'td,j));
没有标题如果已经添加单击排序
如果(!HDRS { J }。标题){,} HDRS setAttribute(标题,
单击排序;
}
}
}
}
};
无功addsortbydate =功能(TBL,COL,datemask){
输入:表名(或对象)、列索引(或数组)
日期 / /面膜('dd-mmm-yy)
一 / /加sortBy = 'date'property到第一行
如果第一个行是标题行,忽略第一行
var i,异常,细胞;
而(col.length)addsortbydate(TBL,col.pop()(),datemask);
(如果(Col是数组)| | isnan(COL))返回;
Var TBL(typeof = = = = TBL 'String')document.getelementbyid(TBL):TBL;
Tbl。行{ 0 } { }。细胞型。sortBy = 'date;
addsortbydate2(TBL,TR,'td,COL,datemask);
};
无功addsortbydate2 =功能(parentel,childtag,coltag,colindex,datemask){
VaR的孩子,开始= 0,我异常,细胞;
VaR母(typeof = parentel = 'String')
document.getelementbyid(parentel):parentel;
(如果)(parent.nodename.tolowercase = = }}){
父母为父母。tbodies { 0 }母| |;
(父母。行{ 0 }。细胞{ 0 }。形式。toLowerCase(= = =)开始'th×1);
}
孩子= parent.getelementsbytagname(childtag);
对(我= = kids.length开始,异常;我<异常;i++){
细胞=孩子{我},{ colindex getElementsByTagName(coltag)};
如果(单元格){
如果(typeof cell.numbervalue!= 'undefined)删除cell.numbervalue;
上面的操作允许从号切换到日期排序。
(虽然不太可能)
如果(cell.getattribute(大概的)){
排序属性如果当前使用
cell.datevalue =新的日期(cell.getattribute(大概的));
{人}
cell.datevalue =新的日期(stringtodate(细胞的节点,第一个孩子。)
DateMask))
}
如果(细胞。datevalue ToString)(cell.datevalue.tostring = =南| |(= =)
无效日期){
Cell.dateValue = 0;
}
}
}
};
无功addsortbynumber =功能(TBL,COL){
是一个列索引或索引数组。
如果第一个行是标题行,忽略第一行
var i,异常,细胞,tempnum;
而(col.length)addsortbynumber(TBL,col.pop());
(如果(Col是数组)| | isnan(COL))返回;
TBL(typeof =任务= = = 'String')document.getelementbyid(TBL):TBL;
Tbl。行{ 0 },{ }细胞Col sortBy =数;
addsortbynumber2(TBL,TR,'td ',Col);
};
无功addsortbynumber2 =功能(parentel,childtag,coltag,colindex){
VaR的孩子,开始= 0,我异常,细胞,tempnum;
VaR母(typeof = parentel = 'String')
document.getelementbyid(parentel):parentel;
(如果)(parent.nodename.tolowercase = = }}){
父母为父母。tbodies { 0 }母| |;
(父母。行{ 0 }。细胞{ 0 }。形式。toLowerCase(= = =)开始'th×1);
}
孩子= parent.getelementsbytagname(childtag);
对(我= = kids.length开始,异常;我<异常;i++){
细胞=孩子{我},{ colindex getElementsByTagName(coltag)};
如果(单元格){
如果(typeof cell.datevalue!= 'undefined)删除cell.datevalue;
上面的操作允许从一个日期切换到一个数字排序。
(虽然不太可能)
tempnum = cell.getattribute(大概的)| | cell.firstchild.nodevalue;
tempnum = tempnum.replace( / { ^ 0-9。- } /克,);
cell.numbervalue = parseFloat(tempnum);
如果(isnan(细胞。numbervalue))
cell.numbervalue = 0;
}
}
};
无功stringtodate =功能(姓名,sformat,截止){
日期值为 /输入字符串,它的格式字符串e.g.'dd-mmm-yy
可选:2位数的截止(整数)。
如果没有'd'appears在 /格式字符串,然后第一个月假设。
年份是如果20和截止值是,那么值将被转换为30。
如果到2020,年为40,那么这个值将转换为1940。
如果没有截止提供/ '20'will是预挂起一年(YY)。
输出:一个字符串的格式 / / / dd'or 'yyyy毫米。
不要试图把某些 /将组合如DMM,MDD,DDM,yyyyd。
VaR稀疏,fndsingle;
稀疏将建设 / / / format'yyyy MM DD
姓名= sdate.tostring()ToUpperCase();
sformat = sformat.touppercase();
如果(sformat.search( /嗯|嗯 /)+ 1){ / / /月03更换损坏,等等。
姓名= sdate.replace(new RegExp('(' + '(' | shortmths.join + ')){到} *,'gi),
函数(m){
var i = shortmths.indexof(m.charat(0)。ToUpperCase()+
M.substr(1, 2),ToLowerCase())+ 1;
返回((我< 10)0 +我:+我)ToString();
});
sformat = sformat.replace( /嗯|嗯 / g,'mm);
}
如果(sformat.search( / / dddd | DDD)+ 1){ / / /星期二取代二,等等。
姓名= sdate.replace(new RegExp('(' + '(' | shortdays.join + ')){到} *,'gi),);
sformat = sformat.replace( / dddd | DDD / g,);
}
姓名= sdate.replace( /(^ | D)( D)(= D |美元)/ g,功能(0美元、1美元、2美元){
2的数字02
返回1美元+ 0+ 2美元;
});
sformat = sformat.replace( /(^ | { ^ DMY })(D | m)(= { ^ DMY } |美元)/ g,功能(0美元、1美元、2美元){
返回1美元+ 2美元+ 2美元替换D或M;
});
是否还有单一的DS或
(fndsingle = sformat.search /(^ | { ^ D D({ })} ^ D |美元)|(^ | { ^ M M({ })^米} |美元)/ + 1);
如果(fndsingle)返回不尝试; / /解析,例如,'dmm
sformat = sformat.replace( /(^ | { ^ Y })(YY)(= { ^ Y } |美元)/ g,功能(0美元,1美元,2美元,指数){)
无功tempdate = sdate.substr(0,指数+ 1);
(截止)(tempdate =(parseInt(sdate.substr(指数1, 2),10)>截止)
19:20):20;
TempDate = sDate.substr (index + 1);
姓名= tempdate;
回报1美元+ 2美元+ 2美元;
});
稀疏=('yyyy /毫米/ DD)。更换( /年|毫米| DD / g,功能(M){)
返回(sformat.indexof(M)+ 1)
SDate.substr(sformat.indexof(M),m.length):;
});
如果(sparsed.charat(0)= =){
如果指定为当前年份,则不指定年份
稀疏=(新的日期()GetFullYear())+稀疏;
}
如果(sparsed.charat(sparsed.length - 1)= =){
没有日期如果,假设第一个月
稀疏= 01;
}
多达10个字符。结束
返回(sparsed.length = = 10):稀疏;
};




希望本文能对大家的javascript程序设计有所帮助。