Как отобразить отсортированный массив

Question

Я пытаюсь отобразить отсортированный массив, используя Javascript DOM, но он отображает только введенный массив. Что я сделал не так?

например, для массива Arr [7,8,2,3,5,4] когда я запускал файл js отдельно от Dom, он отображал [2,3,4,5,7,8], но при использовании DOM [7,8,2,3,5,4]

function BubbleSort(Arr){
    var temp;
    var Arr=document.getElementById("data1").value; 
    for(let i=0;i<Arr.length-1;i++){
        for(let j=0;j<Arr.length-i-1;j++){
            if(Arr[j] > Arr[j+1]){
                temp = Arr[j];
                Arr[j] = Arr[j+1];
                Arr[j+1] = temp;
            }
        }
    }
    console.log(Arr);
    document.getElementById("demo").innerHTML="the answer is :" +Arr;
};

Answer 1

Проблема в том, что вы читаете что-то из DOM и передаете это как массив. После того, как вы прочитали значение из «data1», перед передачей его функции убедитесь, что это массив.

function BubbleSort() {
  var temp;
  var Arr = document.getElementById("data1").value;
  // this next line will split the input if you're setting it as a string
  Arr = Arr.split(',');
  for (let i = 0; i < Arr.length - 1; i++) {
    for (let j = 0; j < Arr.length - i - 1; j++) {
      if (Arr[j] > Arr[j + 1]) {
        temp = Arr[j];
        Arr[j] = Arr[j + 1];
        Arr[j + 1] = temp;
      }
    }
  }
  console.log(Arr);
  document.getElementById("demo").innerHTML = "the answer is :" + Arr;
}
BubbleSort();

<input type="text" id="data1"></input>
<div id="demo"></div>
<button onclick="BubbleSort()">Sort</button>

Answer 2

Итак, вы предоставляете Arr в качестве аргумента, но затем игнорируете его и переделываете Arr

var Arr=document.getElementById("data1").value; 

Прокомментируйте эту строку, и она должна работать нормально.