javascript - 为什么JS通过getComputedStyle()方法获取top值返回的不是设置的top属性值？

问题描述

问 题

如题，给一个<div id="div1" class="div1"></div>的盒子设置css样式为：

.div1{
     width: 200px;
     height: 300px;
     background: red;
     position: absolute;
     left: 100px;
     top: 200px;
}

使用如下方法获取div1盒子的css属性值：

var div1 = document.getElementById("div1");
var ss = window.getComputedStyle(div1,null);
var left = ss.left;
var top = ss.top;

然后使用console.log()打印left和top,结果left打印的值为100px，而打印top结果为一个对象：

请问这是什么原因？

解决方案

这样用

console.log(ss.top);

赋值用法：

var top1 = ss.top;
console.log(top1);

错误用法：

var top = ss.top;
console.log(top);

这篇关于javascript - 为什么JS通过getComputedStyle()方法获取top值返回的不是设置的top属性值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！