offsetLeft不是当前元素的左外边框到包含元素的左内边框之间的像素距离吗？
为什么多出了8px
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test2</title>
<style media="screen">
.cc{
padding: 50px 30px;
}
.fc{
background-color: blue;
width:300px;
height: 200px;
}
</style>
</head>
<body>
<p class="cc">
<p class="fc" >
</p>
</p>
</body>
<script type="text/javascript">
var fc = document.querySelector('.fc');
console.log(fc.offsetLeft+':'+fc.offsetTop);
</script>
</html>
巴扎黑2017-04-17 15:02:35
offsetLeft と offsetTop は、offsetParent 要素に対する相対的な距離を返します。一方、offsetParent は、要素の最も近い親に配置された要素を参照します。配置された要素がない場合、それはドキュメント ルート ノードになります。
現在出力している値と本文自体には 8px のマージンがあり、これは実際には正しいです。 body { margin:0 } を追加するか、親要素に位置を追加すると、出力は期待した数値になります。
