offsetwidth\clientwidth\scrollwidth

About js Medium offsetwidth、clientwidth、scrollwidth And a series of properties and methods have been confused , Here is a summary of the usage and meaning of these methods .

Catalog

One 、clientwidth and clientheigh 、 clienttop and clientleft

Two 、offsetwidth and offsethight 、 offsettop and offsetleft

3、 ... and 、scrollwidth and scrollheight 、 scrolltop and scrollleft

---

One 、clientwidth and clientheigh 、 clienttop and clientleft

        1,clientwidth Actual width of   clientwidth = width+ about padding

        2,clientheigh Actual degree of   clientheigh = height + Up and down padding 

        3,clienttop Actual width of    clienttop = boder.top( The width of the top border )

        4,clientleft Actual width of    clientleft = boder.left( The width of the left border )

Two 、offsetwidth and offsethight 、 offsettop and offsetleft

        1,offsetwidth Actual width of
                offsetwidth = width + about padding + about boder

        2,offsetheith The actual height of
                offsetheith = height + Up and down padding + Up and down boder

        3,offsettop Actual width
                offsettop： The current element On the border Outer edge To The most recent parented （offsetparent） On the border On the inner edge distance . If none of the parents are located , They are to body Top The distance to the left

        4,offsetleft Actual width
                offsetleft： The current element The left margin Outer edge To The most recent parented （offsetparent） The left margin On the inner edge   distance . If none of the parents are located , They are to body Top The distance to the left

3、 ... and 、scrollwidth and scrollheight 、 scrolltop and scrollleft

        1,scrollwidth Actual width
                scrollwidth： Gets the true width of the specified label content layer （ Visual area width + The width of the hidden area ）.

        2,scrollheight The actual height of
                scrollheight： Gets the true height of the specified label content layer （ Height of visible area + The height of the hidden area ）

        3,scrolltop
                scrolltop : Top of content layer To Distance to the top of the visible area .
        4,scrollleft

                scrollleft: Left end of content layer To The distance to the left of the visible area .

Be careful ：  The following element attributes and element methods are passed elem. attribute or elem. Method The way to use ,window Property through window. attribute The way to use ,document Attributes are passed through document call .