如何正確更新對象？

Question

我有一個對象生成器。它正常工作。

'use strict'; 
function Div(isim) { 
    this.loc = document.getElementById(isim); 
    var style = window.getComputedStyle(this.loc); 
    this.width = style.getPropertyValue('width'); 
    this.height = style.getPropertyValue('height'); 
    this.left = style.getPropertyValue('left'); 
    this.top = style.getPropertyValue('top'); 
} 

但後來我更新的元素

var d = new Div("d"); 
d.loc.style.left = getRandomInt(0, window.innerWidth - 50) + "px"; 
d.loc.style.top = getRandomInt(0, window.innerHeight - 50) + "px"; 
console.log(d.left); //gives auto 
console.log(d.width); //gives the right value 

和console.log(d.left)是錯誤的性質。我已經找到一種方法來解決它，但它是一個有點髒，我認爲：

var d = new Div("d"); 
d.loc.style.left = getRandomInt(0, window.innerWidth - 50) + "px"; 
d.loc.style.top = getRandomInt(0, window.innerHeight - 50) + "px"; 
d = new Div("d"); 
console.log(d.left); //gives the right value 
console.log(d.width); //gives the right value 

是否有另一種方式（我更喜歡一個行）？不幸的是， 我不擅長英語，如果有問題的錯誤，標題，請編輯它們。

Answer 1

值緩存，因此你需要重新計算。

function Div(isim) { 
    this.loc = document.getElementById(isim); 
    var style = window.getComputedStyle(this.loc); 
    this.width = style.getPropertyValue('width'); 
    this.height = style.getPropertyValue('height'); 
    this.left = style.getPropertyValue('left'); 
    this.top = style.getPropertyValue('top'); 
    this.getStyle = function (prop) { 
     return style.getPropertyValue(prop); 
    }.bind(this); 
} 

function getRandomInt(min, max) { 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
} 

var d = new Div("d"); 
d.loc.style.left = getRandomInt(0, window.innerWidth - 50) + "px"; 
d.loc.style.top = getRandomInt(0, window.innerHeight - 50) + "px"; 
console.log(d.getStyle('left')); 
console.log(d.getStyle('width')); 

http://jsfiddle.net/s72vg53z/1/

Answer 2

在你的函數變化this.left到

this.left = function() { 
    return window.getComputedStyle(this.loc).getPropertyValue('left'); 
} 

然後在呼叫改變它

console.log(d.left());