Как заставить алгоритм быстрой сортировки отображать результаты на экране, используя Javascript

Мой HTML и JS все здесь:

https://gist.github.com/RoloRobot/b2e15af9ab0d8c1bdbdd

Моя быстрая сортировка работает очень хорошо, но когда я пытаюсь проверить ее, я могу видеть ее только в консоли. Он генерирует случайные числа каждый раз. Я пытаюсь сделать так, чтобы, когда я нажимал кнопку "Начать быструю сортировку", отсортированная случайная последовательность появлялась под кнопкой и продолжалась столько раз, сколько я нажимаю на кнопку.

Любая помощь будет оценена!

3 ответа

Решение

Фрагменты стека - ваш друг!

Ваш код, кажется, отлично работает, когда я заменяю console.log с document.getElementById("QuickTimes").insertAdjacentHTML("beforeend",array);

function quickSort(array, left, right){
   var len = array.length, 
   pivot,
   partitionIndex;


  if(left < right){
    pivot = right;
    partitionIndex = partition(array, pivot, left, right);
    
   quickSort(array, left, partitionIndex - 1);
   quickSort(array, partitionIndex + 1, right);
  }
  return array;
}

function partition(array, pivot, left, right){
   var pivotValue = array[pivot],
       partitionIndex = left;

   for(var i = left; i < right; i++){
    if(array[i] < pivotValue){
      swap(array, i, partitionIndex);
      partitionIndex++;
    }
  }

  swap(array, right, partitionIndex);
  return partitionIndex;
}

function swap(array, i, j){
   var temp = array[i];
   array[i] = array[j];
   array[j] = temp;
}

function RandNum(array, quantity) {
    var num;
    for (var i = 0; i < quantity; i++) {
        num = Math.floor(Math.random() * (100 - 50 + 1)) + 10;
        if (num !== array[i - 1]) {
            array.push(num);
        } else {
            i--;
        }
    }
}

function sort(array){
    quickSort(array,0,array.length - 1);
    document.getElementById("QuickTimes").insertAdjacentHTML("beforeend",array+"<br/>");
}
<button onclick="var a = []; RandNum(a, 9); sort(a);">Quicksort Commence!</button> 
<div id="QuickTimes"> </div> 

Я думаю, что вы ищете insertAdjacentHTML

<!-- YOUR HTML -->
<button onclick="var a = []; RandNum(a, 9); sort(a);">
Quicksort Commence!</button>

<div id="QuickTimes">
</div>

========================================================

//The javascript you need

function sort(array){

    //find the element you want to insert html into
    var el = document.getElementById('QuickTimes'); 

    quickSort(array,0,array.length - 1);

    //for each item in your array insert a p element with the item in the array as the text
    array.forEach(function (item) {
        el.insertAdjacentHTML('beforeend', '<p>' + item + '</p>');     
    });

 }

Ссылка: https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML

Добавьте следующий код после console.log();

var quickTimes = document.getElementById("QuickTimes");
var child = document.createTextNode(array);
quickTimes.appendChild(child);

var linebreak = document.createElement('br');
quickTimes.appendChild(linebreak);
Другие вопросы по тегам