如何使用html css js生成用于排序可视化工具的随机大小数组？

<button onclick="generateArray()">生成随机数组</button>

<div id="arrayContainer"></div>

function generateArray() {
  var arraySize = 10; // 数组大小
  var min = 1; // 数组元素最小值
  var max = 100; // 数组元素最大值
  var array = [];

  for (var i = 0; i < arraySize; i++) {
    var randomNum = Math.floor(Math.random() * (max - min + 1)) + min;
    array.push(randomNum);
  }

  displayArray(array);
}

function displayArray(array) {
  var arrayContainer = document.getElementById("arrayContainer");
  arrayContainer.innerHTML = ""; // 清空容器

  for (var i = 0; i < array.length; i++) {
    var barHeight = array[i] * 3; // 将数组元素的值映射为柱状图的高度
    var bar = document.createElement("div");
    bar.style.height = barHeight + "px";
    arrayContainer.appendChild(bar);
  }
}

#arrayContainer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  height: 300px;
  border: 1px solid #000;
}

#arrayContainer div {
  width: 20px;
  background-color: #00f;
  margin-right: 2px;
}