js中offsetLeft使用方法教程

offsetLeft它以带有定位的父亲为准，如果没有父亲或者父亲没有定位则以body为准。
下面我们看个案例代码：

1. <style>
   
2.         * {
   
3.             margin: 0;
   
4.             padding: 0;
   
5.         }
   
6.         
   
7.         .zidiu {
   
8.             position: relative;
   
9.             width: 200px;
   
10.             height: 200px;
    
11.             background-color: pink;
    
12.             margin-left: 100px;
    
13.         }
    
14.         
    
15.         .son {
    
16.             width: 100px;
    
17.             height: 100px;
    
18.             background-color: red;
    
19.         }
    
20.     </style>
    
21.     <div class="zidiu">
    
22.         <div class="son"></div>
    
23.     </div>
    
24.     <script>
    
25.         var div = document.querySelector('.zidiu');
    
26.         var son = document.querySelector('.son');
    
27.         console.log(son.offsetLeft);
    
28.     </script>

复制代码

输出结果为：0