Home Web Front-end JS Tutorial js code for sorting table data in html_javascript skills

js code for sorting table data in html_javascript skills

May 16, 2016 pm 06:03 PM
table Data sorting

By the way, pay attention to the innerText and innerHTML

Copy code The code is as follows:

function sortCells(event ) {
var obj = event.target;
var count = 0; count records the number of clicks, in ascending or descending order according to odd and even
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;
}
}
    ///This can perform localized sorting of strings
/* 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 ;
}
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
1 months ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
1 months ago By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. Have Crossplay?
1 months ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to access ET files How to access ET files Feb 18, 2024 pm 08:46 PM

ET file is a very common file format, which is usually generated by the table editor in WPS software. Before getting into ET files, we can first understand what ET files are, and then discuss how to open and edit them. ET files are the file format of WPS spreadsheet software, similar to XLS or XLSX files in Microsoft Excel. WPS spreadsheet is a powerful spreadsheet software that provides Excel-like functions for data processing, data analysis and chart creation.

PHP form processing: form data sorting and ranking PHP form processing: form data sorting and ranking Aug 09, 2023 pm 06:01 PM

PHP form processing: form data sorting and ranking In web development, forms are a common user input method. After we collect form data from users, we usually need to process and analyze the data. This article will introduce how to use PHP to sort and rank form data to better display and analyze user-submitted data. 1. Form data sorting When we collect form data submitted by users, we may find that the order of the data does not necessarily meet our requirements. For those that need to be displayed or divided according to specific rules

How to improve the speed of large-scale data sorting through PHP multi-threading How to improve the speed of large-scale data sorting through PHP multi-threading Jun 29, 2023 pm 04:15 PM

How to improve the speed of large-scale data sorting through PHP multi-threading. With the rapid development of the Internet and the popularity of big data, the demand for processing massive data is also increasing. Among them, for the common problem of data sorting, how to improve the processing speed has become an urgent problem to be solved. In the field of PHP, multi-threading technology is considered an effective solution. This article will introduce how to improve the speed of large-scale data sorting through PHP multi-threading. 1. The principle of multi-threading Multi-threading refers to the existence of multiple threads at the same time. Multiple threads can execute different tasks at the same time.

The use of char in mysql The use of char in mysql Apr 27, 2024 am 09:09 AM

The CHAR data type is used to store fixed-length text data in MySQL, which can ensure data consistency and improve query performance. This type specifies the data length, between 0 and 255 characters, which is specified when the table is created and remains constant for all rows of the same column. For variable-length data, it is recommended to use the VARCHAR type.

Detailed explanation of the implementation method of Java selection sort algorithm Detailed explanation of the implementation method of Java selection sort algorithm Feb 20, 2024 am 10:47 AM

Java Selection Sort Code Detailed Explanation and Implementation Method Selection Sort (SelectionSort) is a simple and intuitive sorting algorithm. Its basic idea is to select the smallest (or largest) element from the data elements to be sorted in each pass. Place it at the beginning of the sequence until all data elements to be sorted are arranged. The main advantages of the selection sorting method are that it is simple in idea, easy to implement, and does not require additional storage space, so it shows good performance on some simple sorting problems. Below we explain the selection in detail

How to optimize the efficiency of data sorting and data grouping in PHP and MySQL through indexes? How to optimize the efficiency of data sorting and data grouping in PHP and MySQL through indexes? Oct 15, 2023 pm 04:00 PM

How to optimize the efficiency of data sorting and data grouping in PHP and MySQL through indexes? In the process of developing web applications, it is often necessary to sort and group data. For data sorting and data grouping operations between PHP and MySQL, we can optimize its efficiency through indexes. An index is a data structure used to speed up the retrieval of data. It speeds up sorting, grouping, and lookup operations on data. Below we will introduce how to optimize data sorting and data grouping of PHP and MySQL through indexes.

Aptos Price Forecast 2024-2030 Aptos Price Forecast 2024-2030 Mar 20, 2024 am 11:35 AM

As of July 2023, Aptos remains ranked 35th despite market turmoil and an ongoing bear trend. Although its value has declined, a breakout of its long-term pattern could lead to a short-term rebound. Market conditions will greatly affect APT’s progress, with prices expected to average $16.6 by 2024. Technological advancements expected in 2025 hint at a bright future for Aptos.

How to sort WPS mobile version tables easily with one operation How to sort WPS mobile version tables easily with one operation Feb 09, 2024 pm 08:06 PM

When we process table documents in WPS mobile version, we often need to sort the data in descending or ascending order. So how should novices perform data sorting operations when using WPS mobile version for the first time? Let me teach you below. [Sort method] First, we open the table document, and then select the data to be sorted. Then we click [Data] above and select [Ascending Order] or [Descending Order] inside. Taking descending order as an example, the data inside is sorted. Of course, the same goes for ascending order.

See all articles