如何为HTML元素分配随机ID？

Question

我正在做一个项目，这是一个猜谜游戏。 我希望按钮的顺序是随机的，例如，正确的答案就不会总是左边的。 所以我的HTML按钮ID是“ 1，”，“ 2”，“ 3”，“ 4”，我想给它们分配一个随机ID（例如1变成4），因为我已经尝试过math.random并1-4可能有数字重叠。 我怎样才能使数字不重叠？ 谢谢！

Answer 1

创建一个按钮ID数组（此处将使用1-4），然后从该数组中获取一个随机元素，并将其用作按钮ID。

while循环遍历按钮ID的数组，并随机地将其拉出，然后将其从数组中删除，因此无法再次选择它。 重复此过程，直到按钮ID的数组为空。

 var buttons = [1, 2, 3, 4]; while (buttons.length) { var buttonEl = document.createElement('button'); var buttonId = buttons.splice(Math.floor(Math.random() * buttons.length), 1)[0]; buttonEl.id = 'id-' + buttonId; buttonEl.innerText = buttonId; document.getElementById('buttons').appendChild(buttonEl); } 

 <div id="buttons"> </div> 

Answer 2

我认为最好不要创建或搜索新的随机数。 但改组现有阵列。 然后为按钮分配ID。

 var ids = [1,2,3,4,5]; var shuffledIds = shuffle(ids); console.log(shuffledIds); function shuffle(array) { var rand, index = -1, length = array.length, result = Array(length); while (++index < length) { rand = Math.floor(Math.random() * (index + 1)); result[index] = result[rand]; result[rand] = array[index]; } return result; }