在 JavaScript 中的数据更新后，我的 DOM 对象不会更新

My DOM object will not update after my data updates in JavaScript

本文关键字：更新 我的 DOM 对象 JavaScript 数据      更新时间：2023-09-26

我有一个用构造函数创建的正方形，我的所有数据都会更新，包括它的.style.top 和.style.left，但它不会在页面上更新（图片）。这是我的代码，我省略了构造函数本身，因为它可能不是问题所在。我已经包含了构造函数的方法和方法的调用，它不会更新图片。

  KeyBlock.prototype.move = function(event) {
  if(event.keyCode == 37)
    this.x -= 10;
  if(event.keyCode == 38)
    this.y -= 10;
  if(event.keyCode == 39)
    this.x += 10;
  if(event.keyCode == 40)
    this.y += 10;
  if (this.y < 0)
    this.y = 0;
  if (this.x < 0)
    this.x = 0;
  this.character.style.left = String(this.x) + "px";
  this.character.style.top = String(this.y) + "px";
  console.log(this.character.style.left);
}
me = new KeyBlock("me");
addEventListener("keyup", KeyBlock.prototype.move.bind(me));

如果你想看到构造函数，它可以在这个问题中找到，但可能不需要回答这个问题：原型方法中的事件处理程序函数，为什么它认为.keyCode是JavaScript中未定义的属性？

提前感谢:)

在你

在本问题或链接构造函数中显示的代码中，你都没有给你的角色一个position样式值。 为了使style.left和style.top执行任何操作，必须将style.position值设置为默认值 static 以外的值。

仅供参考，当您向字符串添加数字时，您无需手动将内容转换为字符串（该数字将自动覆盖）。 所以取而代之的是：

this.character.style.left = String(this.x) + "px";

你可以这样做：

this.character.style.left = this.x + "px";
相关文章：