使用JavaScript对html整型表进行排序

我寻求帮助排序一个只包含0-100范围内的数字的html表，我目前的尝试都是用javascript，但是，它不必用javascript完成。问题似乎是它将表数据作为字符串进行排序，因为它将按以下顺序对8、59和1进行排序：1、59、8，我希望将其排序为1、8、59。 我使用的代码来自W3学校：

function sortTable(n) {
  var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
  table = document.getElementById("Tabellen");
  switching = true;
  dir = "asc";
  while (switching) {
    switching = false;
    rows = table.rows;
    for (i = 1; i < (rows.length - 1); i++) {
      shouldSwitch = false;
      x = rows[i].getElementsByTagName("TD")[n];
      y = rows[i + 1].getElementsByTagName("TD")[n];
      if (dir == "asc") {
        if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
          shouldSwitch= true;
          break;
        }
      } else if (dir == "desc") {
        if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
          shouldSwitch = true;
          break;
        }
      }
    }
    if (shouldSwitch) {
      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
      switching = true;
      switchcount ++;
    } else {
      if (switchcount == 0 && dir == "asc") {
        dir = "desc";
        switching = true;
      }
    }
  }
}

---

我在一篇类似于我自己的文章中发现了这一点，这一点本身很好，但是，我不知道如何将其合并到w3schools代码中以使其工作。

您可以首先将字符串转换为数字，然后对其排序

var myArr=['8'，'69'，'1']；
var-Darray=myArr
.map（功能（项目）{
返回编号（项目）；
})
.排序（功能（a、b）{
返回a-b；
});
控制台日志（SorterDarray）；//打印[1,8,69]

您可以先将字符串转换为数字，然后对其排序

var myArr=['8'，'69'，'1']；
var-Darray=myArr
.map（功能（项目）{
返回编号（项目）；
})
.排序（功能（a、b）{
返回a-b；
});
控制台日志（SorterDarray）；//打印[1,8,69]

函数排序表（columnNum）{
//参考：https://www.w3schools.com/howto/howto_js_sort_table.asp
变量表，行，切换，i，x，y，shouldSwitch，dir，switchcount=0；
table=document.getElementById（this.props.id）；
切换=真；
dir=“asc”；
while（切换）{
切换=错误；
行=表。行；
对于（i=1；i<（rows.length-1）；i++）{
shouldSwitch=false；
x=行[i].getElementsByTagName（“TD”）[columnNum]；
y=行[i+1].getElementsByTagName（“TD”）[columnNum]；
x=x.textContent.toLowerCase（）；
y=y.textContent.toLowerCase（）；
设xInt=parseInt（x）；
设yInt=parseInt（y）；
如果（目录==“asc”）{
如果（x==xInt.toString（）&&y==yInt.toString（））{
如果（xInt>yInt）{shouldSwitch=true；break；}
}else{if（x>y）{shouldSwitch=true；break；}
}否则如果（dir==“desc”）{
如果（x==xInt.toString（）&&y==yInt.toString（））{
如果（xInt

}

函数排序表（columnNum）{
//参考：https://www.w3schools.com/howto/howto_js_sort_table.asp
变量表，行，切换，i，x，y，shouldSwitch，dir，switchcount=0；
table=document.getElementById（this.props.id）；
切换=真；
dir=“asc”；
while（切换）{
切换=错误；
行=表。行；
对于（i=1；i<（rows.length-1）；i++）{
shouldSwitch=false；
x=行[i].getElementsByTagName（“TD”）[columnNum]；
y=行[i+1].getElementsByTagName（“TD”）[columnNum]；
x=x.textContent.toLowerCase（）；
y=y.textContent.toLowerCase（）；
设xInt=parseInt（x）；
设yInt=parseInt（y）；
如果（目录==“asc”）{
如果（x==xInt.toString（）&&y==yInt.toString（））{
如果（xInt>yInt）{shouldSwitch=true；break；}
}else{if（x>y）{shouldSwitch=true；break；}
}否则如果（dir==“desc”）{
如果（x==xInt.toString（）&&y==yInt.toString（））{
如果（xInt

---

}

这样比较它们：

+x.textContent>+y.textContent

（

+

将字符串转换为数字）。最后一点提示：。尝试执行此

arr.sort（（a，b）=>Number（a）-Number（b））

如下比较：

+x.textContent>+y.textContent

（

+

将字符串转换为数字）。最后一点提示：。试着这样做

arr.sort（（a，b）=>Number（a）-Number（b））

谢谢你的回答，但我担心我缺乏编程知识，这意味着我不太确定如何在我最初发布的第一个代码中实现这一点，感谢您抽出时间为我写一个答案：）。谢谢您的回答，但我担心我缺乏编程知识，这意味着我不太确定如何在我最初发布的第一个代码中实现这一点，感谢你抽出时间为我写一个答案：）。请解释你改变了什么。请解释你改变了什么。

var collator = new Intl.Collator(undefined, {numeric: true});
var myArray = ['8', '69', '1'];
console.log(myArray.sort(collator.compare));

function sortTable(columnNum){
// ref : https://www.w3schools.com/howto/howto_js_sort_table.asp
var table, rows, switching, i, x, y, shouldSwitch, dir, switchcount = 0;
table = document.getElementById(this.props.id);
switching = true;
dir = "asc"; 
while (switching) {
  switching = false;
  rows = table.rows;
  for (i = 1; i < (rows.length - 1); i++) {
    shouldSwitch = false;
    x = rows[i].getElementsByTagName("TD")[columnNum];
    y = rows[i + 1].getElementsByTagName("TD")[columnNum];
    x = x.textContent.toLowerCase();
    y = y.textContent.toLowerCase();
    let xInt = parseInt(x);
    let yInt = parseInt(y);
    if (dir === "asc") {
      if(x === xInt.toString() && y === yInt.toString()){
        if (xInt > yInt) { shouldSwitch= true;break; }
      }else{ if (x > y) { shouldSwitch= true;break; } }
    } else if (dir === "desc") {
      if(x === xInt.toString() && y === yInt.toString()){
        if (xInt < yInt) { shouldSwitch= true;break; }
      }else{ if (x < y) { shouldSwitch= true;break; } }
    }
    // console.log(x,y)
  }
  if (shouldSwitch) {
    rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
    switching = true;
    switchcount ++;      
  } else {
    if (switchcount === 0 && dir === "asc") { dir = "desc"; switching = true; }
  }
}