JavaScript erhält eine Zusammenfassung der Webseiten-, Browser-, Bildschirmhöhen- und Breitentipps

Ich stelle oft fest, dass ich beim Schreiben von JavaScript die Höhe und Breite der Webseite, des Browsers oder des Bildschirms verwenden muss, um das Problem der Layoutpositionierung zu lösen. Oft vergesse ich es, nachdem ich es zuvor verwendet habe, oder suche einfach weiter Das Internet, also fasse ich es einfach selbst zusammen. Dadurch ist es auch wieder einfacher zu verwenden und spart Zeit und Mühe.

Sichtbare Bereichsbreite der Webseite: document.body.clientWidth
Die Höhe des sichtbaren Bereichs der Webseite: document.body.clientHeight
Die Breite des sichtbaren Bereichs der Webseite: document.body.offsetWidth (einschließlich der Breite der Kanten)
Die Höhe des sichtbaren Bereichs der Webseite: document.body.offsetHeight (einschließlich der Breite der Kante)
Volltextbreite des Webseitenkörpers: document.body.scrollWidth (Breite mit Bildlaufleiste)
Volltexthöhe des Webseitenkörpers: document.body.scrollHeight (Höhe mit Bildlaufleiste)
Die Seite wurde so hoch gescrollt: document.body.scrollTop
Die linke Seite der Webseite, die gescrollt wird: document.body.scrollLeft
Im Hauptteil der Webseite: window.screenTop
Der linke Teil des Webseitentextes: window.screenLeft
Hohe Bildschirmauflösung: window.screen.height
Die Breite der Bildschirmauflösung: window.screen.width
Auf dem Bildschirm verfügbare Arbeitsbereichshöhe: window.screen.availHeight
Auf dem Bildschirm verfügbare Arbeitsbereichsbreite: window.screen.availWidth

HTML-genaue Positionierung: scrollLeft, scrollWidth, clientWidth, offsetWidth
scrollHeight: Ruft die Scrollhöhe des Objekts ab.
scrollLeft: Legt den Abstand zwischen dem linken Rand des Objekts und dem äußersten linken Ende des aktuell sichtbaren Inhalts im Fenster fest oder ruft diesen ab
scrollTop: Legt den Abstand zwischen der Oberkante des Objekts und der Oberkante des sichtbaren Inhalts im Fenster fest oder ruft diesen ab
scrollWidth: Ermitteln Sie die Bildlaufbreite des Objekts
offsetHeight: Ruft die Höhe des Objekts relativ zum Layout oder zur übergeordneten Koordinate ab, die durch die Eigenschaft „offsetParent“ der übergeordneten Koordinate
angegeben wird offsetLeft: Ruft die berechnete linke Position des Objekts relativ zum Layout oder der übergeordneten Koordinate ab, die durch die offsetParent-Eigenschaft
angegeben wird offsetTop: Ruft die berechnete obere Position des Objekts relativ zum Layout oder den übergeordneten Koordinaten ab, die durch das offsetTop-Attribut
angegeben werden horizontale Koordinate von event.clientX relativ zum Dokument
event.clientY vertikale Koordinate relativ zum Dokument
event.offsetX horizontale Koordinate relativ zum Container
event.offsetY vertikale Koordinate relativ zum Container
document.documentElement.scrollTop Der Wert des vertikalen Scrollens
event.clientX document.documentElement.scrollTop Die horizontale Koordinate relativ zum Dokument. Das Ausmaß des vertikalen Bildlaufs

Die Unterschiede zwischen IE und Firefox sind wie folgt:

IE6.0, FF1.06:

Code kopieren Der Code lautet wie folgt:

clientWidth = Breitenauffüllung
clientHeight = Höhenauffüllung
offsetWidth = Breite des Auffüllrahmens
offsetHeight = Höhe des Auffüllrahmens

IE5.0/5.5:

Code kopieren Der Code lautet wie folgt:

clientWidth = Breite – Rand
clientHeight = Höhe – Rand
offsetWidth = Breite
offsetHeight = Höhe

Zusammenfassung: Es gibt viele Dinge über Höhe und Breite. Nachdem ich es selbst getestet habe, sind einige der Werte gleich, daher kann ich mich nur darauf verlassen von der Situation abhängig.