最新的Web开发教程
 

Element offsetLeft Property

<元素对象

得到的offsetLeft位置<div>元素:

<div id="test">
<p>Click the button to get offsetLeft for the test div.</p>
<p><button onclick="myFunction()">Try it</button></p>
<p>offsetLeft is: <span id="demo"></span></p>
</div>

<script>
function myFunction() {
    var testDiv = document.getElementById("test");
    document.getElementById("demo").innerHTML = testDiv.offsetLeft;
}
</script>
试一试»

定义和用法

的offsetLeft属性返回左位(in pixels)相对于所述左侧的offsetParent元件。

返回的值包括:

  • 左位置,并且元件的裕度
  • 在offsetParent元素的左填充,滚动条和边框

注: offsetParent元素都是静态以外的位置最近的祖先。

提示:要返回元素的顶部位置,使用的offsetTop属性。


浏览器支持

属性
offsetLeft 8

句法

返回左偏移位置:

object .offsetLeft

技术细节

默认值: 没有默认值
返回值: 一个数字,表示该元素的左侧位置,以像素为单位
DOM版本: CSSOM

更多示例

获得AA的位置<div>元素:

<div id="test">
<p>Click the button to get the left and top offsets for the test div.</p>
<p><button onclick="myFunction()">Try it</button></p>
<p id="demo">offsetLeft: <br>offsetTop: </p>
</div>
<script>
function myFunction() {
    var testDiv = document.getElementById("test");
    var demoDiv = document.getElementById("demo");
    demoDiv.innerHTML = "offsetLeft: " + testDiv.offsetLeft + "<br>offsetTop: " + testDiv.offsetTop;
}
</script>
试一试»


<元素对象