javascript - 生成四个随机数并将其附加到 DOM

Question

我正在练习基本 JavaScript 知识，这是我的第一个项目。问题是这样的:

我喜欢生成一个 4 的随机数并将其附加到 DOM，因此每当用户按下空格键时，就会生成一个 4 的随机数，并且对网站可见，而不必查看控制台。

我已经使用 querySelecter 缓存 DOM 并监听按钮的 keydown。

let randNum;
const numArr = [];
const box = document.querySelector('.box');

function genNum (e) {

  const button = document.querySelector(`.button[data-key="${e.keyCode}"]`);
  if(!button) return;

  numArr.forEach(numbers => {
    randNum = Math.floor(Math.random() * 10)
  });
};

window.addEventListener('keydown', genNum)

主要目的是生成0到9的4个随机数，并将其附加到DOM调用框。每当用户按下空格键时，他们都会在前端看到任何随机数

Answer 1

你的numArr是空的，所以它的.forEach()不会有多大作用。我猜你总是想数到 4。

const box = document.querySelector('.box');

function genNum (e) {
  const button = document.querySelector(`.button[data-key="${e.keyCode}"]`);
  if(!button) return;
  
  for (var i = 0; i < 4; i++) {
    box.textContent += Math.floor(Math.random() * 10) + ","
  }
}

window.addEventListener('keydown', genNum)

<input type=hidden class=button value=spacebar data-key=32>
<div class=box></div>