如何获取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中的样式属性的初始值？

回答

相关问题