Obtenez la position et la taille des éléments en utilisant JS natif

1. Hauteur intérieure, largeur intérieure : marge intérieure + zone de contenu

clientWidth
clientHeight

2. Hauteur extérieure, largeur extérieure : bordure + marge intérieure + zone de contenu

offsetWidth
offsetHeight

3 . Bordure supérieure, bordure gauche

clientTop
clientLeft

4. La taille de l'élément et sa position par rapport à la fenêtre

getBoundingClientRect()
//x\y:元素的左上角和父元素左上角的距离
//width/height:边框 + 内边距 + 内容框
//top:元素的上边界和父元素上边界的距离
//left:元素的左边界和父元素左边界的距离
//right:元素的右边界和父元素的左边界的距离
//bottom:元素的下边界和父元素上边界的距离

5. 🎜>

offsetTop
offsetLest

document.documentElement.clientWidth
document.documentElement.clientHeight

document.documentElement.scrollWidth
document.documentElement.scrollHeight

window.screenX、
window.screenY

window.screen.width
window.screen.height

<🎜. >11. Contenu de la fenêtre Hauteur, largeur intérieure (zone d'affichage du document + barre de défilement)

window.screen.availWidth
window.screen.availHeight

12. Hauteur extérieure et largeur extérieure de la fenêtre

window.innerWidth
window.innerHeight

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!