javascriptのclientHeight、scrollHeight、offset Height

1761 ワード

いずれも一つのDomノードの高さを取得するために使用されますが、彼らの意味は同じではありません.
 
clientHeight:
MDNによるこの属性の説明は以下の通りである.
The  Element.clientHeight read-only property returns the inner height of an element in pixels、including padding but not the horizontal scrollbar height、border、or margin.clientHeight can be caculated as CSS  height + CSS  padding - height of horizontal scrollbar(if present)
説明から分かるように、読み取り専用の属性です.1つのDomノードの内部(inner)高さを表し、インレットを含むが、水平スクロールバー、外枠、外枠は含まれない.
 
offset Height:
MDNによるこの属性の説明は以下の通りである.
The  HTMLElement.offsetHeight read-only property the height of the element including vertical padding and borders,in pixels,as an integer.
Typeically,an element's  offsetHeight is a meass rement which includes the element borders,the element vertical padding,the element horizontal scrollbar(if present,if renderd)and the element CSS height.
For the document body object,the meass rement includes total linear content height instead of the element CSS height.Float element.Float element.eding belowhere contentar red.
内充填、外枠、水平スクロールバーを含み、外距離は含まれていません.
 
scrollHeight:
MDNによるこの属性の説明は以下の通りである.
The  Element.scrollHeight read-only atribute is a measrement of the height of an element's content,including content not visible on the screen due to overflow.The scrollHeight value is equal to the minimum  clientHeight the element would require in order to fit all the content in the view point without using a vertical scrollbar.It includes the element padding but not its magin.
これも読み取り専用の属性です.一つのDomノードのコンテンツの高さを表し、オーバーフローのために見えないコンテンツを含み、同様にインクリメントを含むが、外枠と外距離は含まれない.