如何使用 Javascript 使快速排序算法在屏幕上显示结果

Question

我的HTML和JS都在这里：

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

我的快速排序工作得很好，但是当我尝试测试它时，我只能在控制台中查看它。它每次都会生成随机数。我试图做到这一点，以便当我按下 "Commence Quicksort" 按钮时，排序后的随机序列将出现在按钮下方，并且无论我按下按钮多少次都会继续。

如有任何帮助，我们将不胜感激！

Answer 1

我认为您正在寻找 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

Answer 2

在 console.log();

之后添加以下代码

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

var linebreak = document.createElement('br');
quickTimes.appendChild(linebreak);

Answer 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>

如何使用 Javascript 使快速排序算法在屏幕上显示结果

How to make a Quicksort algorithm display results on the screen using Javascript

javascript

quicksort