ホームページ > ウェブフロントエンド > jsチュートリアル > html_javascriptスキルでテーブルデータをソートするためのjsコード

html_javascriptスキルでテーブルデータをソートするためのjsコード

WBOY
リリース: 2016-05-16 18:03:38
オリジナル
1090 人が閲覧しました

ちなみに、innerText と innerHTML に注目してください

コードをコピー コードは次のとおりです。

function sortCells(event ) {
var obj =event.target;
var count = 0; 奇数と偶数に従って昇順または降順でクリック数を記録します
if(! .getAttribute("clickCount")){
obj.setAttribute("clickCount", 0);
} else {
count = parseInt(obj.getAttribute("clickCount")); ;
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 = テーブル。親ノード;
} 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;
}
}
var 列 = table.rows(1) .cells.length;
var row = table.rows.length;
var Ar = new Array(row - 1);
for (x = 0; x Ar[x] = 新しい配列 (列);
}
for (x = 1; x for (y = 0; 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 for (y = 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 table .rows(x).cells(y ).innerHTML = Ar[x - 1][y]
}
}
カウント
}

;
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート