获取javascript中的位置不起作用

我想做一个小游戏，但我有一些启动问题

当我尝试获取track或trackCont的位置时，它总是返回x:0，y:0。无法获得正确的位置移动DIV时使用：

float: right;
display: block;

甚至使用以下工具也不起作用：

position: absolute;
left: 100px;

以下是我正在使用的代码：

var Player = new Array();
var trackEntity;

function getPosition(elem){
    xPos = 0;
    yPos = 0;
    while(elem){
        xPos += (elem.offsetLeft + elem.clientLeft);
        yPos += (elem.offsetTop + elem.clientTop);
        elem = elem.offsetParent;
    }

    return {x: xPos, y: yPos};
}

window.onload = function(){
    trackEntity = document.getElementById("trackCont");
    for (i = 0; i < 4; i += 1){
        Player[i] = new Object();
        document.body.innerHTML += "<div id='p" + i + "' class='player'></div>";
        Player[i].entity = document.getElementById("p" + i);
        Player[i].entity.style.backgroundColor = "rgb(" 
                                               + Math.floor(Math.random() * 256) + ", "
                                               + Math.floor(Math.random() * 256) + ", "
                                               + Math.floor(Math.random() * 256) + 
                                                 ")";
        Player[i].entity.style.left = (getPosition(trackEntity).x) + 20;
        Player[i].entity.style.top = (getPosition(trackEntity).y) + 20;
    }
}

var Player=new Array（）；
var跟踪实体；
功能getPosition（elem）{
xPos=0；
yPos=0；
while（elem）{
xPos+=（elem.offsetLeft+elem.clientLeft）；
yPos+=（元素offsetTop+元素clientTop）；
elem=elem.offsetParent；
}
返回{x:xPos，y:yPos}；
}
window.onload=函数（）{
trackEntity=document.getElementById（“trackCont”）；
对于（i=0；i<4；i+=1）{
Player[i]=新对象（）；
document.body.innerHTML+=“”；
Player[i].entity=document.getElementById（“p”+i）；
Player[i].entity.style.backgroundColor=“rgb（”
+Math.floor（Math.random（）*256）+“，”
+Math.floor（Math.random（）*256）+“，”
+Math.floor（Math.random（）*256）+
")";
Player[i].entity.style.left=（getPosition（trackEntity.x）+20；
Player[i].entity.style.top=（getPosition（trackEntity.y）+20；
}
}

---

当为css

左

赋值时，您需要向提供一个

单位

 Player[i].entity.style.left = (getPosition(trackEntity).x) + 20 +"px";   

如果将值指定给css维度或位置属性，则在未指定单位时，该属性不会更新

当调用

getPosition（trackEntity）

时，它似乎不知道它在DOM中的位置。这是由于

document.body.innerHTML += "<div id='p" + i + "' class='player'></div>";

---

你的意思是设定，而不是获取？您正在尝试设置位置，还是获取位置？获取轨迹位置，然后在JSFIDLE中设置玩家位置，图像处于预期位置。以前发现此问题，在使用

div

s进行游戏/动画时可能会令人恼火。下一次，我建议使用

canvas

——它在渲染方面更好，构建速度更快，总体上更灵活。播放器（div id=p）定位工作正常，但使用TrackEntity调用getPosition（）时总是返回0。在现代浏览器中不应该这样。不带单位的赋值应被忽略。@INASENE96MCP这样做就可以了。

 Player[i].entity = document.createElement("div");
 Player[i].entity.id = "p" + i;
 //etc.

 document.body.appendChild(Player[i].entity);

 //Run position code.