Quelles sont les propriétés couramment utilisées pour obtenir la taille de la fenêtre en js ?

window.innerHeight (innerWidth) : représente la hauteur (largeur) de la zone visible s'il y a une barre de défilement en bas (à droite), la hauteur (largeur) du bas (à droite). ) la barre de défilement sera calculée Entrez, Cette méthode convient aux navigateurs standards et à IE9+.

document.documentElement.clientHeight(clientWidth) : représente la hauteur (largeur) de la zone visible, et la hauteur et la largeur de la barre de défilement ne seront pas calculées <.> Cette méthode est applicable dans les navigateurs standards et les versions inférieures du mode standard d'IE .

document.documentElement.offsetHeight(offsetWidth): Tout d'abord, offsetWidth obtient la même valeur que clientWidth et offsetHeight obtient la hauteur de l'ensemble du document.

Remarque :
Personnellement, je pense que le documentElement ci-dessus ne représente pas le corps. Lorsqu'un élément a une bordure, element.offsetHeight contient la valeur de la bordure, mais element.clientHeight ne contient pas la largeur de la bordure.

document.documentElement.scrollHeight(scrollWidth): Obtenir la hauteur et la largeur du texte intégral du corps de la page Web, y compris la largeur des bords.

document.body.clientHeight(clientWidth) : Tout d'abord, la valeur obtenue par clientWidth est égale à document.documentElement.offsetWidthCoupez la largeur du bord du corps, tandis que clientHeight obtient la totalité de la hauteur du corps moins la largeur du bord.

document.body.offsetHeight(offsetWidth) : La valeur obtenue par est égale à document.body.clientHeight(clientWidth) plus la largeur de la bordure du corps, c'est-à-dire que ces deux valeurs obtiennent la largeur du bord inclus.

document.body.scrollHeight(scrollWidth): Obtient la hauteur et la largeur du texte intégral du corps de la page Web, y compris la largeur des bords.

document.body.scrollTop(scrollLeft): La distance entre le haut de la fenêtre du navigateur et le haut du document (la distance entre la fenêtre du navigateur et le côté gauche du document ), c'est-à-dire la barre de défilement La distance à parcourir.

window.pageYOffset (pageXOffset) : La distance entre le haut de la fenêtre du navigateur et le haut du document (la distance entre la fenêtre du navigateur et le côté gauche du document), c'est-à-dire que la barre de défilement fait défiler la distance.

window.screen.height(width) : La hauteur (largeur) de la résolution de l'écran.

window.screen.availHeight(availWidth) : Hauteur de la zone de travail disponible de l'écran (largeur).

Expliquons ce que

offsetTop, clientTop et scrollTop représentent respectivement :

offsetTop :La position à partir du haut ou du contrôle supérieur, entier, unité pixel.

clientTop :La distance entre la zone de contenu de l'élément et le bord de l'élément, c'est-à-dire la largeur du bord de l'élément.

scrollTop :La distance entre le haut de la fenêtre de l'élément et le haut de l'élément, c'est-à-dire la distance de défilement de la barre de défilement à l'intérieur de l'élément.

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!