如何獲取JavaScript中的樣式屬性的初始值？

在我的HTML文件我有以下的標記：如何獲取JavaScript中的樣式屬性的初始值？

<div class="long_box"> 
    <div class="image1"> <img src="images/image1.png"> </div> 
    <div class="image2"> <img src="images/image2.png"> </div> 
    <div class="image3"> <img src="images/image3.png"> </div> 
</div>

在CSS文件我已經申請了以下樣式規則：

.long_box { 
    width: 3300px; 
    height: 768px; 
    position: absolute; 
    left: 10px; 
    top: 0; 
}

在javascript文件我做了一個變量：

var longbox = document.getElementsByClassName("long_box")[0];

現在，當我嘗試回憶left的long_box的初始值爲longbox.style.left時，I g et一個空字符串""。但是在使用javascript更改left值後，例如如longbox.style.left = 100 + 'px，然後調用它的值，然後在控制檯中獲得100px。所以，

如何獲得JavaScript中的樣式屬性的初始值？

來源

2016-04-29 user31782

你所說的「初始值」的意思是？你的意思是「初始值」的CSS定義，還是別的？ – BoltClock

你可以嘗試使用attr（）來檢索值 –

@BoltClock通過初始值，我的意思是在CSS文件中分配的值 - 這可能會在稍後由javascript更改。在改變它們之後，我可以以某種方式訪問它們 - 也許是因爲'this.style.left = 100 +'px''添加了內聯樣式。 – user31782

的Javascript element.style只返回內嵌樣式，其他樣式，例如在樣式表設置，你必須使用getComputedStyle

var longbox = document.getElementsByClassName("long_box")[0]; 

var styles = window.getComputedStyle(longbox); 

var lef  = styles.getPropertyValue("left");

來源

2016-04-29 09:02:49 adeneo

我很好奇。當你引用'inline styles'時，你的意思是直接在html上的樣式嗎？ –

是的，JavaScript直接在元素上設置內聯樣式 – adeneo

我可以定義'longbox.style = getComputedStyle（longbox）'嗎？ – user31782

如何獲取JavaScript中的樣式屬性的初始值？

回答

相關問題