函数用到的属性有:
| element.offsetLeft | 返回当前元素的相对水平偏移位置的偏移容器 |
| element.offsetParent | 返回元素的偏移容器 |
| element.offsetTop | 返回当前元素的相对垂直偏移位置的偏移容器 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body { margin: 0; padding: 0;} div { padding: 10px; } #div1 { background-color: #006FDF; position: relative;} #div2 { background-color: #00A881; position: relative;} #div3 { background-color: #FFCC33; position: relative;} </style> </head> <body> <div id="div1"> <div id="div2"> <div id="div3"> </div> </div> </div> <script> var oDiv = document.getElementById('div3'); var p = getPos(oDiv); alert(p.left); //获取元素在页面中left,top值(忽略其父级的定位) function getPos(obj){ var pos = {left:0, top:0}; while(obj){ pos.left += obj.offsetLeft; pos.top += obj.offsetTop; obj = obj.offsetParent; } return pos; } </script> </body> </html>