javascript - 使用 JavaScript 解析 CSS 样式 marginLeft

Question

我正在尝试解析 marginLeft HTML 的属性值元素使用 JavaScript ，但我不确定我做错了什么。

我已经使用了这两种方法(使用或不使用 ,10 )，但使用我的 Current marginLeft: NaN 得到“console.log ” :

var elementMargin = document.getElementById("main");
var style = elementMargin.currentStyle || window.getComputedStyle(elementMargin);

// tried this

var oldValue = parseInt(document.getElementById("main").style.marginLeft, 10);
console.log("Current marginLeft: " + oldValue);

// or this

var oldValue = parseInt(document.getElementById("main").style.marginLeft);
console.log("Current marginLeft: " + oldValue);

当我直接阅读和 console.log的属性值，我没有收到错误:

var elementMargin = document.getElementById("main");
var style = elementMargin.currentStyle || window.getComputedStyle(elementMargin);

console.log("Current marginLeft: " + style.marginLeft); 

我得到输出“Current marginLeft: 199px”

这是基于这篇文章:Get a number for a style value WITHOUT the "px;" suffix

我做错了什么？

Answer 1

在第一个示例中，您得到的是计算 的左边距，它将为您提供样式表层叠后的任何边距。

在第二个和第三个示例中，您将获得 style 属性中指定的左边距。由于您得到的是 NaN，这大概不是使用 style 属性设置的，所以是 undefined。

将 parseInt 添加到您首先使用的代码中。