jQuery 中 jQuery.offset() 方法的作用是什么?


offset() 方法获取第一个匹配元素当前偏移量(以像素为单位),它相对于文档的位置。

示例

你可以尝试运行以下代码来学习在 jQuery 中如何使用 offset() 方法

实时演示

<html>
   <head>
      <title>jQuery offset() method</title>
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
       
      <script>
         $(document).ready(function() {
           
            $("div").click(function () {
               var offset = $(this).offset();
               $("#lresult").html("left offset: <span>" + offset.left + "</span>.");
               $("#tresult").html("top offset: <span>" + offset.top + "</span>.");
            });
               
         });
      </script>
       
      <style>
         div {
             width:60px;
             height:60px;
             margin:5px;
             float:left;
         }
      </style>
   </head>
   
   <body>
   
      <p>Click on any square:</p>
      <span id = "lresult"> </span>
      <span id = "tresult"> </span>
       
      <div style = "background-color:blue;"></div>
      <div style = "background-color:pink;"></div>
      <div style = "background-color:#123456;"></div>
      <div style = "background-color:#f11;"></div>
       
   </body>
</html>

更新于: 2019-12-10

93 人浏览

开启你的 事业

通过完成课程来获得认证

开始
广告