Πώς να ταξινομήσετε λισταράδα

Δημιουργία συνάρτησης ταξινόμησης

παράδειγμα

function sortTable() {
  var table, rows, switching, i, x, y, shouldSwitch;
  table = document.getElementById("myTable");
  switching = true;
  /* Make a loop until the condition is met. */
  no switching has been done: */
  while (switching) {
    // Πρώτα δήλωσε: δεν υπάρχει γραμμή που πρέπει να ανταλλαγεί:
    switching = false;
    rows = table.rows;
    /* Traverse all table rows (except the first one, as it contains the table header): */
    Για (i = 1; i < (rows.length - 1); i++) {
      // First declare that no exchanges should be made:
      /* Λάβετε τα δύο στοιχεία που θέλετε να συγκρίνετε, ένα από την τρέχουσα γραμμή και ένα από την επόμενη γραμμή: */
      /* Get the two elements to compare, one from the current row and one from the next row: */
      x = rows[i].getElementsByTagName("TD")[0];
      y = rows[i + 1].getElementsByTagName("TD")[0];
      // Check if the two rows should be swapped positions:
      Αν (dir == "desc") {
        // If an exchange should be made, mark it as needing an exchange and exit the current loop
        shouldSwitch = true;
        break;
      }
    }
    Αν (shouldSwitch) {
      /* Αν έχει σημαδευτεί ως αναγκαία αντικατάσταση, εκτελέστε την αντικατάσταση και σημαδέψτε ότι έχει γίνει αντικατάσταση: */
      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
      switching = true;
    }
  }
}

Δοκιμάστε το προσωπικά

Sort the table by clicking on the table header

Κάντε κλικ στο "Name" για να ταξινομήσετε κατά όνομα, κάντε κλικ στο "Country" για να ταξινομήσετε κατά χώρα.

Η πρώτη πατήση θα είναι αύξηση (από A σε Z).

Αν πατήσετε ξανά, η κατεύθυνση της σειράς θα είναι αποκλιμάκωση (από Z σε A):

παράδειγμα

<table id="myTable2">
<tr>
<!-- When the table header is clicked, run the sortTable function and pass a parameter, 0 means sort by name, 1 means sort by country: -->
<th onclick="sortTable(0)">Name</th>
<th onclick="sortTable(1)">Country</th>
</tr>
...
<script>
function sortTable(n) {
  var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
  table = document.getElementById("myTable2");
  switching = true;
  // Ρυθμίστε την κατεύθυνση της ταξινόμησης σε αύξηση:
  dir = "asc";
  /* Δημιουργήστε έναν κύκλο που θα συνεχίζει να εκτελείται μέχρι να μην υπάρχουν γραμμές που πρέπει να ανταλλαγούν: */
  while (switching) {
    // Πρώτα δήλωσε: δεν υπάρχει γραμμή που πρέπει να ανταλλαγεί:
    switching = false;
    rows = table.rows;
    /* Περιηγηθείτε σε όλες τις γραμμές της τραπέζης (εκτός από την πρώτη γραμμή, γιατί περιέχει την κεφαλίδα): */
    Για (i = 1; i < (rows.length - 1); i++) {
      // Πρώτα δήλωσε: η τρέχουσα γραμμή και η επόμενη γραμμή δεν πρέπει να ανταλλαγούν θέσεις:
      /* Λάβετε τα δύο στοιχεία που θέλετε να συγκρίνετε, ένα από την τρέχουσα γραμμή και ένα από την επόμενη γραμμή: */
      x = rows[i].getElementsByTagName("TD")[n];
      y = rows[i + 1].getElementsByTagName("TD")[n];
      /* Ελέγξτε αν αυτές οι δύο γραμμές πρέπει να ανταλλαγούν θέσεις, βασισμένοι στην κατεύθυνση της ταξινόμησης, αύξηση ή μείωση: */
      Αν (dir == "asc") {
      Αν (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
        Αν (dir == "desc") {
          // Αν πρέπει να γίνει αντικατάσταση, σημαδέψτε ως αναγκαία αντικατάσταση και βγείτε από τον τρέχοντα κύκλο:
          shouldSwitch = true;
          break;
        }
      }
        Αν (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
          // Αν πρέπει να γίνει αντικατάσταση, σημαδέψτε ως αναγκαία αντικατάσταση και βγείτε από τον τρέχοντα κύκλο:
          shouldSwitch = true;
          break;
        }
      }
    }
    Αν (shouldSwitch) {
      /* Αν έχει σημαδευτεί ως αναγκαία αντικατάσταση, εκτελέστε την αντικατάσταση και σημαδέψτε ότι έχει γίνει αντικατάσταση: */
      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
      switching = true;
      // Κάθε φορά που γίνεται αντικατάσταση, αυξάνεται αυτός ο αριθμητής 1:
      switchcount ++;
    }
      /* Αν δεν έχει γίνει αντικατάσταση και η κατεύθυνση της ταξινόμησης είναι "αύξηση", τότε ρυθμίστε την κατεύθυνση της ταξινόμησης σε "μείωση" και εκτελέστε ξανά τον κύκλο while. */
      Αν (switchcount == 0 && dir == "asc") {
        dir = "desc";
        switching = true;
      }
    }
  }
}
</script>

Δοκιμάστε το προσωπικά

ταξινομώντας την τаблицή με αριθμούς

παράδειγμα

Αν (Number(x.innerHTML) > Number(y.innerHTML)) {
  shouldSwitch = true;
  break;
}

Δοκιμάστε το προσωπικά