如何获取margin的值

通过js获取高度时往往会忽略掉对应的 margin-top 或 margin-bottom , 这个时候获取到的高度会有偏差 , 那怎么可以避免这个偏差呢 ?

目前有两种方法如下 :

(1) 写法一 :

let secDiv = document.querySelector('.sec');
// 获取元素
document.defaultView.getComputedStyle(secDiv);
// 可打印查看具体的值

(2) 写法二 :

let secDiv = document.querySelector('.sec');
// 获取元素
window.getComputedStyle(secDiv);
// 可打印查看具体的值

getComputedStyle ( element [,pseudo] ) : 可以有一个参数,也可以有两个参数 , 第二个参数是伪类 ::before，该参数不是必须的，空字符串或没有参数则表示元素本身。当不查询伪类元素的时候可以忽略或者传入 null 。

element : 都应该知道这个参数是元素的意思吧 , 再次不做过多介绍
[,pseudo] : 此种格式不必纠结 , 只是代表可选的意思 , 即可有可无

经过本人的实验 , 直接获取里边的margin值还是不可以的 , 所以本人常用另一种方法

(3) 写法三 :

let secDiv = document.querySelector('.sec');
// 获取元素
let secMargin = getComputedStyle(secDiv);
// 可打印查看具体的值
console.log(secMargin.marginBottom);
// 打印出类名为sec的标签的margin-bottom的值

以上纯属个人理解 , 如有差异欢迎评价或留言 !