时间戳

首页 > 解决方案 > 如何将多个元素作为一个对象

javascript - 如何将多个元素作为一个对象

问题描述

我使用多个 div 在 css 中创建形状，我想在 javascript 中将它们组合为一个对象以创建一个播放器并能够使用箭头键移动播放器。我尝试使用 class 属性并将它们全部设为同一个类名称，但它不起作用。我刚开始学习如何在编码中进行游戏开发，所以我不确定这段代码是否接近正确。

我可以在此代码中添加什么以使它们出现在对象/元素上？我怎样才能让它们与箭头键一起移动？

 var playerHead = document.getElementById("playerHead");

    var playerMouth = document.getElementById("playerMouth");

    var playerOuterEye =document.getElementById("playerOuterEye");

    var playerInnerEye =document.getElementById("playerInnerEye");

    var playerBody = document.getElementById("playerBody");

    var playerArm = document.getElementById("playerArm");

    var playerLeg = document.getElementById("playerLeg");

所以你可以看到这些元素中的每一个都是用css制作的形状，我想将它们全部组合成一个对象，这样我就可以制作一个按下箭头键移动的玩家。

标签： javascripthtml

解决方案

const player = {
   playerHead:  document.getElementById("playerHead"),
   playerMouth: document.getElementById("playerMouth"),
   playerOuterEye: document.getElementById("playerOuterEye")
}

等等。这样每个值都是播放对象的一个​​属性。

至于在页面上移动某些内容，您需要提供更多信息。我们不知道你在移动什么，或者你试图如何移动它。老实说，对于 css 和某些元素选择器而言，您尝试做的事情太复杂了。我会研究一个真正的js 动画库。

推荐阅读