So bedienen Sie die Breiten- und Höhenattribute der Seite, des visuellen Bereichs, des Bildschirms usw.

Dieses Mal zeige ich Ihnen, wie Sie die Breiten- und Höhenattribute der Seite, den sichtbaren Bereich, den Bildschirm usw. und die Vorsichtsmaßnahmen für die Bedienung von Breite und Höhe bedienen Attribute der Seite, sichtbarer Bereich, Bildschirm usw. Was sind das? Hier sind die tatsächlichen Fälle.

Über einige verwandte Breiten- und Höhenattribute der Seite, des visuellen Bereichs, des Bildschirms usw.

function size(){
	document.write(
	"屏幕分辨率为："+screen.width+"*"+screen.height
	+"<br />"+
	"屏幕可用大小："+screen.availWidth+"*"+screen.availHeight
	+"<br />"+
	"网页可见区域宽："+document.body.clientWidth
	+"<br />"+
	"网页可见区域高："+document.body.clientHeight
	+"<br />"+
	"浏览器窗口宽："+document.documentElement.clientWidth
	+"<br />"+
	"浏览器窗口高："+document.documentElement.clientHeight
	+"<br />"+
	"html所有元素宽："+document.documentElement.offsetWidth
	+"<br />"+
	"html所有元素高："+document.documentElement.offsetHeight
	+"<br />"+
	"网页可见区域宽(包括边线的宽)："+document.body.offsetWidth 
	+"<br />"+
	"网页可见区域高(包括边线的宽)："+document.body.offsetHeight 
	+"<br />"+
	"网页正文全文宽："+document.body.scrollWidth
	+"<br />"+
	"网页正文全文高："+document.body.scrollHeight
	+"<br />"+
	"网页被卷去的高："+document.body.scrollTop
	+"<br />"+
	"网页被卷去的左："+document.body.scrollLeft
	+"<br />"+
	"网页正文部分上："+window.screenTop
	+"<br />"+
	"网页正文部分左："+window.screenLeft
	+"<br />"+
	"屏幕分辨率的高："+window.screen.height
	+"<br />"+
	"屏幕分辨率的宽："+window.screen.width
	+"<br />"+
	"屏幕可用工作区高度："+window.screen.availHeight
	+"<br />"+
	"屏幕可用工作区宽度："+window.screen.availWidth
	);
}

Darüber hinaus gibt es einige Attribute über die Position und Größe des HTML-Dom-Elements, wie z folgt

offsetWidth

offsetWidth	clientWidth	scrollWidth
offsetHeight	clientHeight	scrollHeight
offsetLeft	clientLeft	scrollLeft
offsetTop	clientTop	scrollTop

clientWidth

scrollWidth

offsetHeight

clientHeight

scrollHeight

offsetLeft

clientLeft

scrollLeft

offsetTop

clientTop

scrollTop

1. clientHeight und clientWidth werden verwendet, um die innere Größe des Elements zu beschreiben, die sich auf die Größe des Elementinhalts + innerer Rand bezieht, ohne den Rand (beinhaltet tatsächlich ). unter IE), Rand , Bildlaufleistenteil

2. offsetHeight und offsetWidth werden verwendet, um die äußere Größe des Elements zu beschreiben, die sich auf den Elementinhalt + inneren Rand + Rand bezieht, ausgenommen der äußere Rand und der Bildlaufleistenteil

3. clientTop und clientLeft geben den horizontalen und vertikalen Abstand zwischen der Kante der Polsterung und der Außenkante des Rahmens zurück, also die linke und obere Randbreite

4. offsetTop und offsetLeft repräsentieren die obere linke Ecke des Elements (Border Außenkante ) und den Abstand von der oberen linken Ecke des positionierten übergeordneten Containers (offsetParent-Objekt).

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Bitte beachten Sie auch andere verwandte Artikel auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der H5+Canvas-Anwendungsfälle

So verwenden Sie die Javascript-Datumsformatmethode

Das obige ist der detaillierte Inhalt vonSo bedienen Sie die Breiten- und Höhenattribute der Seite, des visuellen Bereichs, des Bildschirms usw.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!