javascript - 无法更改对象位置

Question

var img = new Image();
img.className = "block";
img.src = "http://db.tt/xCGgJN48";
img.style.left = x + "px";
img.style.top = y + "px";
var array = [];
array.push(img);
document.getElementById("mydiv").appendChild(array[0]);
//imagine some delay here
array[0].style.left = (array[0].style.left + 10) + "px";

我无法让图像移动。这不是实际代码，最后一行代码没有移动它，中间还有其他代码。怎么了？？

Answer 1

这行代码就是问题所在:

(array[0].style.left + 10) + "px";

array[0].style.left 返回类似 100px 的内容。因此，向其添加 10 将是 100px10，然后向其添加 px 将是 100px10px。你需要做的是使用parseInt 将100px 转换为100，然后添加10 将110，并向其添加 px 将为您提供正确的 110px。

array[0].style.left = parseInt(array[0].style.left) + 10 + "px";