即使在JavaScript

Question

我正在制作影响一类菜单的动画，它将菜单滑入和滑出屏幕的左侧。但是因为我改变了app的另一部分的宽度值，我不得不以某种方式研究css，

这就是我在CSS中所拥有的：

1. 宽度（600px（取决于设备））


使用Javascript我改变了：

1. 宽度（相对数量）
2. left（-width）

左边很简单，因为我可以做-element.offsetWidth 但宽度更难，因为我不知道它会改变多少，我也不想在其中硬编码。

有没有人知道让我在改变之前调查css元素的方法？ （因为它是用代码写的）

到目前为止我尝试过：

1. element.offsetWidth（无效，因为它返回当前宽度而不是css中写入的宽度）
2. element.style.width（因为它返回一个空字符串而无效）




  

注意：   有一个类似的问题How do I retrieve an HTML element's actual width and height?，但答案给出了当前宽度，我想要CSS设置的宽度（加载文档时）

简化代码：

Answer 1

您可以在Chrome等浏览器中使用developer tools来查看和使用css。

如果您在Sources tab in Chrome dev tools中设置Javascript断点，则可以直观地看到在应用javascript之前元素的外观。

如果要在JavaScript控制台日志.style.height和.style.width中以编程方式查看元素的宽度和高度。

e.g。 console.log(document.getElementById('my-element').style.width)