如何在javascript中的列表中对日期进行排序？

Question

Since I am a beginner, I don't know how to start sorting the date column. I have another column which is total price in my table. I managed to sort the price column since it only involves number only.

The codes I provided below is how I successfully sort price column.

//function to sort number
  function sortLowest() {
        var table, rows, switching, i, x, y, shouldSwitch;
        table = document.getElementById("example");
        switching = true;
        while (switching) {
            switching = false;
            rows = table.rows;
            for (i = 1; i < (rows.length - 1); i++) {
                shouldSwitch = false;
                x = rows[i].getElementsByTagName("TD")[6];
                y = rows[i + 1].getElementsByTagName("TD")[6];
                if (parseInt(x.innerHTML.toLowerCase()) > parseInt(y.innerHTML.toLowerCase())) {
                    shouldSwitch = true;
                    break;
                }
            }
            if (shouldSwitch) {
                rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
                switching = true;
            }
        }
    }

Below are the html code

  <p id="rating">Filter by Price:
  <select id="myList" class='form-control' style="width: 100%">
  <option id="stylesheet1" value="low">Lowest-Highest</option>
  <option id="stylesheet2" value="high">Highest-Lowest</option>
  </select></p>

<script>
  document.getElementById("myList").onchange = function() {
        var sheet = document.getElementById("myList").value;
        if (sheet == "high") {
            sortHighest();
        } else {
            sortLowest();
        }
        return false
    };
</script>

Answer 1

It would definitely be easier with a sort method but I would assume that you need to use a similar logic as the one above. You're also dealing with dates so you need to convert your string/text to dates before sorting; meaning using Date.now() or new Date().

I guess you do get the rows with rows = table.rows; and that getElementsByTagName("TD")[7] gives you the date column (I'm using 7 as an example since you wrote 6 as the price in your description so please use whatever column index is correct to get the dates for your problem). If these assumptions are correct, you can re-order by doing something like this and using a similar logic as above for dates:

        while (switching) {
            switching = false;
            rows = table.rows;
            for (i = 1; i < (rows.length - 1); i++) {
                shouldSwitch = false;
                x = new Date(rows[i].getElementsByTagName("TD")[7].innerHTML.split('/').reverse().join(', '));
                y = new Date(rows[i + 1].getElementsByTagName("TD")[7].innerHTML.split('/').reverse().join(', '));

                if (x > y) {
                    shouldSwitch = true;
                    break;
                }
            }
            if (shouldSwitch) {
                rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
                switching = true;
            }
        }

nb: The reason why I re-ordered '16/09/2019' to be '2019, 09, 16' with .split('/').reverse().join(', ') is because something like new Date('16/09/2019') does not work as opposed to new Date('2019, 09, 16') which does.

Please let me know if this solution solves your issue or if you have any question.