js实现div上下左右的key

可以使用JavaScript监听键盘事件，然后根据按下的键触发对应的操作。以下是实现上下左右键控制div移动的示例代码：

HTML：

<div id="box" style="position: absolute; top: 50px; left: 50px;">Hello World</div>

JavaScript：

var box = document.getElementById("box");
document.addEventListener("keydown", function(event) {
  var top = parseInt(box.style.top);
  var left = parseInt(box.style.left);
  switch(event.keyCode) {
    case 37: // left arrow
      box.style.left = left - 10 + "px";
      break;
    case 38: // up arrow
      box.style.top = top - 10 + "px";
      break;
    case 39: // right arrow
      box.style.left = left + 10 + "px";
      break;
    case 40: // down arrow
      box.style.top = top + 10 + "px";
      break;
  }
});

在这个示例中，我们使用`keydown`事件监听键盘按下事件。然后根据按下的键的`keyCode`属性决定移动方向。在每个方向上，我们都修改`div`元素的`top`或`left`属性来实现移动。注意，我们需要使用`parseInt`函数将`top`和`left`属性的值转换为数字类型，否则会出现字符串拼接而非数字相加的行为。