Zusammenfassung der Methoden zum Ermitteln der Breite und Höhe einer Webseite mithilfe von Javascript_Javascript-Kenntnissen

document.body.clientWidth – die Breite des sichtbaren Bereichs der Webseite
document.body.clientHeight – die Höhe des sichtbaren Bereichs der Webseite

document.body.offsetWidth – die Breite des sichtbaren Bereichs der Webseite, einschließlich der Breite der Kanten und Bildlaufleisten
document.body.offsetHeight – die Höhe des sichtbaren Bereichs der Webseite, einschließlich der Höhe der Kanten und Bildlaufleisten [FF, Chrom ist die Höhe der gesamten Seite, IE Opera ist normal]

document.body.scrollWidth – die Gesamtbreite der Webseite
document.body.scrollHeight – die Gesamthöhe der Webseite

document.body.scrollTop – Wenn eine Bildlaufleiste vorhanden ist, ziehen Sie die Bildlaufleiste nach unten und stellen Sie die Höhe des Teils ein, der nicht darüber angezeigt wird
document.body.scrollLeft – Dasselbe wie oben

window.innerHeight – Die innere Höhe des Browserfensters

window.innerWidth – Die innere Breite des Browserfensters

window.screenTop – der Abstand zwischen dem oberen Rand des Webdokuments und dem oberen Rand des Bildschirms im Textteil der Webseite. FF unterstützt dies jedoch nicht. Chrom, IE und Opera verhalten sich daher unterschiedlich. Verwenden Sie es daher mit Vorsicht]
window.screenLeft – Die linke Seite des Webseitentextes [der Abstand zwischen der äußersten linken Seite des Webseitendokuments und der äußersten linken Seite des Bildschirms, aber FF unterstützt dies nicht. Chrom, IE und Opera verhalten sich daher unterschiedlich mit Vorsicht]

window.screen.height – die Höhe der Bildschirmauflösung
window.screen.width – die Breite der Bildschirmauflösung

window.screen.availHeight – verfügbare Arbeitsbereichshöhe [gesamter Bildschirm, aber ohne untere Taskleiste]
window.screen.availWidth – Verfügbare Arbeitsbereichsbreite [Breite des gesamten Bildschirms]

window.screen.clorDepth – Bildschirmfarbe, häufig verwendet 16, 32 Bit usw.
window.screen.deviceXDPI – Bildschirmpixel/Zoll [vom IE unterstützt, von anderen nicht unterstützt]

JavaScript-Methode zum Abrufen der Seitenbreite und -höhe

<script>
function getInfo()
{
  var s = "";
  s += " 网页可见区域宽："+ document.body.clientWidth;
  s += " 网页可见区域高："+ document.body.clientHeight;
  s += " 网页可见区域宽："+ document.body.offsetWidth + " (包括边线和滚动条的宽)";
  s += " 网页可见区域高："+ document.body.offsetHeight + " (包括边线的宽)";
  s += " 网页正文全文宽："+ document.body.scrollWidth;
  s += " 网页正文全文高："+ document.body.scrollHeight;
  s += " 网页被卷去的高(ff)："+ document.body.scrollTop;
  s += " 网页被卷去的高(ie)："+ document.documentElement.scrollTop;
  s += " 网页被卷去的左："+ document.body.scrollLeft;
  s += " 网页正文部分上："+ window.screenTop;
  s += " 网页正文部分左："+ window.screenLeft;
  s += " 屏幕分辨率的高："+ window.screen.height;
  s += " 屏幕分辨率的宽："+ window.screen.width;
  s += " 屏幕可用工作区高度："+ window.screen.availHeight;
  s += " 屏幕可用工作区宽度："+ window.screen.availWidth;
  s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
  s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
  //alert (s);
}
getInfo();
</script>

In meinem lokalen Test:
Kann unter IE, Firefox und Opera verwendet werden

document.body.clientWidth
document.body.clientHeight

Sie können es jetzt bekommen, es ist sehr einfach und bequem.
Und unter den Unternehmensprojekten:
Opera verwendet immer noch

document.body.clientWidth
document.body.clientHeight

Aber IE und Firefox verwenden

document.documentElement.clientWidth
document.documentElement.clientHeight

Es stellt sich heraus, dass es die W3C-Standards sind, die Probleme verursachen

958d744a298c46c0daa211c304ba8ee6
Wenn Sie diese Tag-Zeile zur Seite hinzufügen

Im IE:

document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度

In Firefox:

document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度

In Opera:

document.body.clientWidth ==> 可见区域宽度
document.body.clientHeight ==> 可见区域高度
document.documentElement.clientWidth ==> 页面对象宽度（即BODY对象宽度加上Margin宽）
document.documentElement.clientHeight ==> 页面对象高度（即BODY对象高度加上Margin高）

Und wenn kein W3C-Standard definiert ist, dann

IE ist:

document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0

Firefox ist:

Code kopieren Der Code lautet wie folgt:

document.documentElement.clientWidth ==> , BODY-Objektbreite plus obere Randbreite)
document.documentElement.clientHeight ==> Seitenobjekthöhe (d. h. BODY-Objekthöhe plus Randhöhe)

Oper ist:

Code kopieren Der Code lautet wie folgt:

document.documentElement.clientWidth ==> (d. h. BODY-Objektbreite plus Randbreite)
document.documentElement.clientHeight ==> Seitenobjekthöhe (d. h. BODY-Objekthöhe plus Randhöhe)

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.