前端三大家族之offset,然后做出鼠标的拖拽效果

offset 用于获取元素的偏移量:

可以获取元素距离带有定位的父元素的位置【注意条件需要有定位】,如果父元素没有定位,则会向上寻找直到找到带有定位的那个父级元素
offsetTop:获取到元素距离带有定位的父元素的顶部的距离
offsetLeft:获取到元素距离带有定位的父元素的左边的距离

可以获取元素本身的大小(获取到的值不带单位), padding + width + border
offsetWidth:获取到元素的宽度
offsetHeight:获取到元素的高度

了解了 offsetTop 和 offsetLeft 之后我们就可以做一个拖拽元素的小练习了,实现思路如下图:
前端三大家族之offset,然后做出鼠标的拖拽效果_第1张图片

代码如下:




  
  
  
  Document
  



  

你可能感兴趣的:(前端三大家族之offset,然后做出鼠标的拖拽效果)