Perbezaan antara scrollWidth, clientWidth dan pertukaran offsetWidth

Perbezaan antara scrollWidth, clientWidth dan pertukaran offsetWidth_Experience

PHP中文网

Lepaskan： 2016-05-16 12:07:35

asal

1708 orang telah melayarinya

Perbezaan antara scrollWidth, clientWidth dan offsetWidth_Experience exchange

scrollWidth
ialah lebar kandungan sebenar objek, tidak termasuk lebar tepi dan akan berubah dengan kandungan daripada objek (Lebih banyak kandungan boleh mengubah lebar sebenar objek).
clientWidth
ialah lebar objek yang boleh dilihat, tidak termasuk bar skrol dan tepi lain, dan akan berubah mengikut saiz paparan tetingkap.
offsetWidth
ialah lebar objek yang boleh dilihat, termasuk bar skrol dan tepi lain, yang akan berubah mengikut saiz paparan tetingkap.

Contoh scrollWidth dan clientWidth:

<html>  
<head>  
<title>77.htm文件</title>  
</head>  
<body>  
<textarea wrap="off" onfocus="alert(&#39;scrollWidth:&#39;+this.scrollWidth+&#39;\n clientWidth:&#39;+this.clientWidth);">
</textarea>  
</body>  
</html>

Salin selepas log masuk

Masukkan kandungan dalam kotak teks Apabila bar skrol mendatar tidak muncul, nilai scrollWidth dan clientWidth adalah yang sama. Apabila baris kandungan melebihi lebar kotak teks, bar skrol mendatar muncul dan nilai scrollWidth berubah.
scrollWidth ialah lebar kandungan sebenar objek.
clientWidth ialah lebar yang dilihat oleh objek (tidak termasuk tepi), yang tidak akan berubah dalam contoh ini.

Contoh clientWidth dan offsetWidth:

<html>  
<head>  
<title>77.htm文件</title>  
</head>  
<body>  
<textarea wrap="off" onfocus="alert(&#39;offsetWidth:&#39;+this.offsetWidth+&#39;\n clientWidth:&#39;+this.clientWidth);">
</textarea>  
</body>  
</html>

Salin selepas log masuk

Nilai offsetWidth sentiasa lebih besar daripada nilai clientWidth.
clientWidth ialah lebar yang dilihat oleh objek (tidak termasuk tepi)
offsetWidth ialah lebar yang dilihat oleh objek (termasuk tepi, seperti lebar yang diduduki oleh bar skrol)

The di atas ialah scrollWidth, Perbezaan antara kandungan pertukaran clientWidth dan offsetWidth_Experience, sila perhatikan laman web PHP Cina (www.php.cn) untuk kandungan yang lebih berkaitan!