javascript - 函数返回的正确语法以更改 Javascript 中的 div 尺寸

Question

我试图通过使用函数的返回来改变 div 的高度和宽度，但我似乎无法弄清楚如何让语法正确读取(ei. “400 像素”)。在此先感谢您的帮助!

document.getElementById("box").onclick = function() {
  function color() {
    var choice = ["red", "blue", "green", "yellow", "purple", "orange", "pink", "gray", "brown"];
    var random = Math.random();
    random = (11 * random) / 1.25;
    random = Math.floor(random);
    return choice[random];
  }

  function size() {
    var dimensions = x + 'px';
    var x = Math.random();
    x = x * 1000;
    x = Math.floor(x);
    return dimensions;
  }

  clickedTime = Date.now();
  reactionTime = (clickedTime - createdTime) / 1000;
  document.getElementById("time").innerHTML = reactionTime;
  this.style.display = "none";
  this.style.background = color();
  this.style.height = size();
  this.style.height = size();
  size();

  boxReset();
}

boxReset();

Answer 1

除了某种形式的 function 声明之外，代码按照它出现的顺序进行处理。

function size() {
  // x is undefined at this point and mostly useless
  var x = Math.random();
  // x is useful now
  x = x * 1000;
  // x is more useful
  x = Math.floor(x);
  // x is super useful now!
  var dimensions = x + 'px';
  // dimensions is useful now, too
  return dimensions;
}