您的位置:首页 > Web前端 > JavaScript

javascript的offsetTop[Left]获得左和上距离 clientWidth,offsetWidth

2016-06-08 13:45 627 查看
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javascript的offsetTop[Left]获得左和上距离</title>
<style>
#div1 { width:1000px; height:500px; background-color:#7A7A7A; margin:0px auto;}
#div2 { width:800px; height:300px; background-color:#F54F52;margin:0px auto; }
#div3 { width:500px; height:100px; background-color:#3D9F48;margin:0px auto;}
</style>
<script>
window.onload = function(){
var Div1 = document.getElementById('div1');
var Div2 = document.getElementById('div2');
var Div3 = document.getElementById('div3');

//alert(Div1.clientWidth);  //可视区宽 + padding
//alert(Div1.offsetWidth);  //占位宽 + padding + border

//alert(Div3.offsetTop);
//alert(Div3.offsetLeft);
//alert(Div3.offsetTop);
//alert(Div3.offsetTop);

}
</script>
</head>
<body>
<div id="div1">
<div id="div2">
<div id="div3"></div>
</div>
</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: