JS 元素的相关尺寸获取

<style>
    #big {
        width:400px;
        height:400px;
        background:orange;
        position:absolute;
    }
    #small {
        width:100px;
        height:300px;
        background:pink;
        position:absolute;
        left:50px;
        top:100px;
    }
</style>
<div id="big">
    <div id="small">
    </div>
</div>
<script type="text/javascript">
    //获取small div的宽度
    var small = document.getElementById('small');
    //宽度
    var width = small.offsetWidth; // 100
    //高度
    var height = small.offsetHeight; // 200
    //当前元素相对父级元素x轴的偏移量
    var left = small.offsetLeft; // 50
    //当前元素相对父级元素y轴的偏移量
    var t = small.offsetTop;  // 100 不要使用top来作为变量,top为保留字
</script>