scrollWidth,clientWidth与offsetWidth的区别
时间：2024-04-22 22:28:38
scrollWidth
是对象的实际内容的宽，不包边线宽度，会随对象中内容的多少改变（内容多了可能会改变对象的实际宽度）。
clientWidth
是对象可见的宽度，不包滚动条等边线，会随窗口的显示大小改变。
offsetWidth
是对象的可见宽度，包滚动条等边线，会随窗口的显示大小改变。
一个scrollWidth和clientWidth的例子：
<html>
<head>
<title>77.htm文件</title>
</head>
<body>
<textarea wrap="off" onfocus="alert('scrollWidth:'+this.scrollWidth+'\n clientWidth:'+this.clientWidth);"></textarea>
</body>
</html>
在文本框内输入内容，当横向滚动条没出来前scrollWidth和clientWidth的值是一样的。当一行内容超出文本框的宽度，就有横向滚动条出来了，scrollWidth的值就变了。
scrollWidth是对象实际内容的宽度。
clientWidth是对象看到的宽度（不含边线），这个例子里不会改变。
一个clientWidth和offsetWidth的例子：
<html>
<head>
<title>77.htm文件</title>
</head>
<body>
<textarea wrap="off" onfocus="alert('offsetWidth:'+this.offsetWidth+'\n clientWidth:'+this.clientWidth);"></textarea>
</body>
</html>
offsetWidth的值总是比clientWidth的值大。
clientWidth是对象看到的宽度（不含边线）
offsetWidth是对象看到的宽度（含边线，如滚动条的占用的宽）
0
投稿猜你喜欢
asp.net 字符串、二进制、编码数组转换函数
webstorm中配置Eslint的两种方式及差异比较详解
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
Python3安装pip工具的详细步骤
关于vscode 默认添加python项目的源目录路径到执行环境的问题
通过C++学习Python
Python实现自动计算特定格式的时间差
Oracle生成单据编号存储过程的实例代码
如何解决从文本文件中调出记录出现丢失换行的问题？
Django auth 应用模块详解
使用Python+Flask开发博客项目并实现内网穿透
深入理解golang的异常处理机制
Python NumPy灰度图像的压缩原理讲解
XML入门的常见问题(一)
使用Pycharm分段执行代码
PyCharm 2021.2 (Professional)调试远程服务器程序的操作技巧
基础的十进制按位运算总结与在Python中的计算示例
Tensorflow简单验证码识别应用
Python中的变量赋值
HTML编辑器FCKeditor使用详解
