Indica le differenze tra la proprietà width CSS e clientWidth
importanza: 5
Quali sono le differenze tra getComputedStyle(elem).width e elem.clientWidth?
Indica almeno 3 differenze. Più sono meglio è.
Differenze:
- clientWidth è un valore numerico, getComputedStyle(elem).width invece restituisce una stringa con px alla fine.
- getComputedStyle può restituire una larghezza non numerica come "auto" per un elemento inline.
- clientWidth è l’area del contenuto interna di un elemento più il padding, mentre la proprietà width dei CSS (con il valore predefinito di box-sizing) è l’area del contenuto interna senza il padding.
- Se c’è una barra di scorrimento ed il browser le riserva uno spazio, alcuni browser sottraggono quello spazio alla larghezza impostata tramite CSS (perché non è più disponibile per i contenuti), e altri invece no. La proprietà clientWidth è sempre la stessa: se la barra di scorrimento ha uno spazio riservato viene sottratto all’area del contenuto.