javascriptを使用してピクセルの左/右/上/下のプロパティの値を取得する方法は？

Question

#testの左/右/上/下のプロパティをpxに取得する必要があります。プロパティ値にautoを与える私のjsコード。 pxで値を取得するにはどうすればよいですか？

<div id="test"> 
    <p>Dummy text</p> 
</div> 

#test{ 
    position: absolute; 
} 

window.onload = function(){ 
    var test = document.getElementById("test"); 
    var left = window.getComputedStyle(test).getPropertyValue("left"); 
    console.log(left); // auto 
}; 

Answer 1

このコード

window.onload = function(){ 
 
    var test = document.getElementById("test"); 
 
    
 
    var left = test.offsetLeft; 
 
    var right = test.offsetWidth - left; 
 
    var top = test.offsetTop; 
 
    var bottom = test.offsetHeight - top; 
 
    
 
    document.write("Left:" + left + "//"); 
 
    document.write("Right:" + right + "//"); 
 
    document.write("Top:" + top + "//"); 
 
    document.write("Bottom:" + bottom); 
 
};

#test{ 
 
    position: absolute; 
 
}

<div id="test"> 
 
    <p>Dummy text</p> 
 
</div>

を使用します

Answer 2

使用offsetLeft代わり

test.offsetLeft

window.onload = function(){ 
 

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

 
    document.write(test.offsetLeft); // auto 
 
};

#test{ 
 
    position: absolute; 
 
}

<div id="test"> 
 
    <p>Dummy text</p> 
 
</div>