我无法在 HTML (innerHTML) 中使用 Javascript 显示我的排序数组答案

【问题标题】：I can't display my sorted array with Javascript in HTML (innerHTML)我无法在 HTML (innerHTML) 中使用 Javascript 显示我的排序数组
【发布时间】：2019-08-23 10:00:34
【问题描述】：

我对一个整数数组进行了排序，并尝试用 HTML 显示它，但我不知道该怎么做。

我已经尝试在不使用显示功能的情况下打印元素

var array = [4, 2, 8, 3, 5];

for (var i = 0; i < array.length; i++) {
  for (var j = i + 1; j < array.length; j++) {
    if (array[i] > array[j]) {
      var temp = array[i];
      array[i] = array[j];
      array[j] = temp;
    }
  }
}

function display(array) {
  for (var i = 0; i < array.length; i++) {
    console.log(array[i]);
    document.getElementById("visualization").innerHTML = array;
  }
}

window.document.getElementById("visualization").innerHTML = display(array);

&lt;p id="visualization"&gt;&lt;/p&gt;

预期结果：2,3,4,5,8 实际结果：未定义

当我使用 Chrome 控制台时，它运行良好！排序代码没有错。

【问题讨论】：

display 函数不返回任何内容，因此 undefined 即函数调用的结果会显示在页面上。
而且你在显示函数中也多次分配了innerHTML。
为什么需要自定义排序算法？ Array.prototype.sort 做到了，而且做得更好

标签： javascript html innerhtml

【解决方案1】：

您的问题是 display 函数的执行不返回任何内容，因此它隐式返回 undefined 并且您将此结果 (undefined) 设置为该元素的 innerHTML。一种可能的解决方案是从display 函数返回字符串，或者准备该函数内所有值的字符串，将innerHTML 设置为该字符串，不返回任何内容，然后只调用display 函数（下面是一个示例）

你需要为innerHTML创建字符串

var array = [4, 2, 8, 3, 5];

array.sort((a,b) => a < b ? -1 : (a == b ? 0 : 1));

function display(array){
    var html = "";
    for(var i=0; i<array.length; i++){
        console.log(array[i]);
        html += `<p>${array[i]} </p>`;
    }
    document.getElementById("visualization").innerHTML = html;

}

display(array)

<html>
    <head>

    </head>

    <body>
        <p id="visualization"></p>
    </body>
</html>

【讨论】：

【解决方案2】：

我稍微简化了你的代码，

看看jsFiddle，

你可以只使用数组排序方法，

您正在尝试对一个没有返回值的函数进行 innerHTML。而是尝试返回一个字符串，或者使用字符串连接方法

 var array = [4, 2, 8, 3, 5];

array.sort()

document.getElementById("visualization").innerHTML = array.join(",")

<html>
    <head>

    </head>

    <body>
        <p id="visualization"></p>
    </body>
</html>

https://jsfiddle.net/mje21Lwv/

  var array = [4, 2, 8, 3, 5];

  array.sort()

  document.getElementById("visualization").innerHTML = array.join(",")

【讨论】：

非常感谢，但我尝试在不使用排序功能的情况下对其进行排序。顺便说一句，我返回了我的数组，一切正常。非常感谢