使用JavaScript增加顶部/左侧/底部/右侧值

Question

我试图通过 x 像素来增加元素的位置。这是我到目前为止所尝试的：

var top = document.getElementById("something").style.top;
top = top + "300px"

我知道这不起作用，但我想知道是否可以增加这样的位置值。

Answer 1

因为style.top是一个字符串，其末尾有单位"300px"，所以当你只将数字部分转换为实际数字时，你只能用它来计算数学。

假设你有一个定位元素（所以设置top值会做一些事情）你已经在元素上直接设置了top样式而没有通过CSS设置（所以得{{1}实际上会给你一些东西），你可以通过解析样式值中的数字来做到这一点：

obj.style.top

工作示例：http://jsfiddle.net/jfriend00/pt46X/

Answer 2

这样做不会很好，例如，如果top的值为200px，则会"200px300px"。试试这个：

var elem = document.getElementById("something");
elem.style.top = parseInt(elem.style.top, 10) + 300 + "px"

Demo WEEEE!!!!

Answer 3

let top = 0;
let left = 0;
let text = document.getElementById("TextToTranslate");
text.setAttribute("style","top:"+top+"px; "+left+":px;");

在while循环中使用它，效果很好，我只是想知道如何降低它的速度，这样我才能看到过渡情况