jQuery 中position()与offset()的区别

最新推荐文章于 2024-09-16 20:08:29 发布

weixin_33832340

最新推荐文章于 2024-09-16 20:08:29 发布

阅读量76

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/feilu2016/p/7027717.html

版权

position():获取匹配元素中第一个元素的当前坐标，相对于offset parent的坐标。( 译者注：offset parent指离该元素最近的而且被定位过的祖先元素 )

offset():在匹配的元素集合中，获取的第一个元素的当前坐标，或设置每一个元素的坐标，坐标相对于文档。.offset()方法允许我们重新设置元素的位置，这个元素的位置是相对于document对象的。如果对象原先的position样式属性是static的话，会被改成relative来实现重定位。

不同之处在于：

.position()是相对于 相对于父级元素的位移。当通过全局操作（特别是通过拖拽操作）将一个新的元素放置到另一个已经存在的元素的上面时，若要取得这个新的元素的位置，那么使用 .offset() 更合适。 .offset()是相对于文档的偏移

eg:

<style>
        .div1{
          position: absolute;
           top: 200px; 
           left: 200px;
          width: 100px;
          height: 100px;
          background: red;
      }
    </style>
    <script src="jquery.min.js"></script>
    <script>
       $( document ).ready(function() {
           alert($(".div2").position().left);
    });
    </script>
</head>
<body>
  <div class="div1">
     <div class="div2">hahh</div>
 </div>

position:0,0

offset:200,200

转载于:https://www.cnblogs.com/feilu2016/p/7027717.html