通过JavaScript中的div.style.left获取值的解决方案

一、问题概述：

样式必须直接写在元素内部，才能通过div.style.left直接获取属性值(即必须是内联样式)，css中定义的样式不能通过这种方式获取。

让元素移动到200停止

setTimeout(function(){ var div=document . getelementbyid(' div 4 ')；//var left=ParSeint(div . style . left)5；var left=div . offsetleft 5；div . style . left=left ' px '；if(左200){ setTimeout(arguments . calluer，50)；} }, 50);二、关于offset ref和left的区别(关于offset ref:https://developer . Mozilla . org/zh-cn/docs/web/API/htmlelement/offset ref)

1.定义位置的元素：相对或绝对属性有left属性，所有元素都有offsetLeft属性。

2.left设置在元素的内联样式中，可以通过div.style.left获取；OffsetLeft直接通过div.offsetLeft获取。

3.left可读可写，得到的字符串；OffsetLeft是只读的，并且获取该数字。

相似性：定位方法相同。如果父元素有定位元素(位置设置为相对或绝对)，它将相对于定位元素定位，否则它将相对于图元定位。

三.案例：

HTMLElement.offsetParent是一个只读属性，它返回一个定位元素，该元素指向最近的(在包含级别最接近的)并包含该元素。如果没有定位的元素，offsetParent是最近的表元素对象或根元素(html在标准模式下；身体处于怪癖模式)。当元素的style.display设置为“none”时，OffsetParent返回null。OffsetParent很有用，因为offsetTop和offsetLeft都是相对于它们的内部边距边界的。

下面的span的父元素没有定位元素集，所以这个元素的offsetParent是根元素，此时的offsetTop是相对于基元定位的。

div style=' width: 300px边框颜色：蓝色；border-style : solid；边框宽度：1；'跨度短。/span span id='long '缠绕在此分区内的长跨度。/span/div div id=' box ' style=' position : absolute；边框-颜色：红色；边框宽度： 1；边框样式：实心；z-index : 10 '/div script var box=document . getelementbyid(' box ')；var long=document . getelementbyid(' long ')；////长。offset ref是跨度的偏移量。//span是一个内嵌元素，没有绝对定位，但是默认情况下offserParent是父元素，而不是根//box.style.left=long。offsetledocument . body . scroll left ' px '；box . style . top=long . offsettop document . body . scroll top ' px '；box . style . width=long . offsetwidth ' px '；box . style . height=long . offset ThEight ' px '；/脚本

如果向long的父元素添加定位属性，结果如下：

四.总结：

在javascript中，通过offsetLeft(offsetTop)方法获取元素偏移量值是很方便的，并得到该值。使用style.left(上、右、下)更改元素的偏移值，并通过style.left获取字符串的值。如果要通过style.left更改元素的位置，必须首先通过parseInt将获取的当前左值转换为数值。

以上就是边肖介绍的JavaScript中无法通过div.style.left获取值的解决方案。希望对你有帮助。如果你有任何问题，请给我留言。