JavaScript -使用WASD移动一个角色，但很难将移动分解为更简单的功能

document.addEventListener('keydown', function(event) {
  // 处理键盘按下事件
});

var character = document.getElementById('character'); // 获取角色元素
var positionX = 0; // 初始化角色的水平位置

document.addEventListener('keydown', function(event) {
  if (event.key === 'w') {
    positionX -= 10; // 向左移动10个像素
  } else if (event.key === 'd') {
    positionX += 10; // 向右移动10个像素
  }
  
  character.style.transform = 'translateX(' + positionX + 'px)'; // 更新角色的位置
});

var character = document.getElementById('character'); // 获取角色元素
var positionX = 0; // 初始化角色的水平位置
var maxX = window.innerWidth - character.offsetWidth; // 页面的宽度减去角色的宽度

document.addEventListener('keydown', function(event) {
  if (event.key === 'w') {
    positionX -= 10; // 向左移动10个像素
  } else if (event.key === 'd') {
    positionX += 10; // 向右移动10个像素
  }
  
  // 边界检测
  if (positionX < 0) {
    positionX = 0;
  } else if (positionX > maxX) {
    positionX = maxX;
  }
  
  character.style.transform = 'translateX(' + positionX + 'px)'; // 更新角色的位置
});