scrollWidth,clientWidth,offsetWidth的区别
作者:hebedich 发布时间:2024-04-22 22:29:00
标签:scrollWidth,clientWidth,offsetWidth
通过一个demo测试这三个属性的差别。
说明:
scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大。
clientWidth:对象内容的可视区的宽度,不包滚动条等边线,会随对象显示大小的变化而改变。
offsetWidth:对象整体的实际宽度,包滚动条等边线,会随对象显示大小的变化而改变。
该demo就在页面中放一个textarea元素,采用默认宽高显示。
情况1:
元素内无内容或者内容不超过可视区,滚动不出现或不可用的情况下。
scrollWidth=clientWidth,两者皆为内容可视区的宽度。
offsetWidth为元素的实际宽度。
情况2:
元素的内容超过可视区,滚动条出现和可用的情况下。
scrollWidth>clientWidth。
scrollWidth为实际内容的宽度。
clientWidth是内容可视区的宽度。
offsetWidth是元素的实际宽度。
END


猜你喜欢
- 本文主要介绍了OpenCV 图像对比度,具有一定的参考价值,感兴趣的可以了解一下实现原理图像对比度指的是一幅图像中明暗区域最亮的白和最暗的黑
- dlib包安装失败 python安装dlib时报错:Running setup.py install for dlib &helli
- 问题描述:使用指令 python -m pip install --upgrade pip 升级pip时,Pycharm报错:Attribu
- 简单说明:思路:从数据岛menuXML中读取数据,从树的根节点开始分析树,利用 hasChildNodes() [方法:是否含有子节点 ]
- 发送电子邮件在即时通信软件如此发达的今天,电子邮件仍然是互联网上使用最为广泛的应用之一,公司向应聘者发出录用通知、网站向用户发送一个激活账号
- 事件是javascript中的核心内容之一,在对事件的应用中不可避免的要涉及到一个重要的概念,那就是事件冒泡,在介绍事件冒泡之前,先介绍一下
- 前言kylin是一个开源的OLAP分析引擎,具有亚秒级查询大表的能力通过kylin提供的cube预构建功能,省去了不断写sql查询hive的
- 本文实例讲述了Python实现两个list求交集,并集,差集的方法。分享给大家供大家参考,具体如下:在python中,数组可以用list来表
- 代码: import os while True: dynamic = input('输入计算表达式:') if dynam
- 环境配置新建python虚拟环境并激活conda create -n pyqt python=3.8conda activate py36安
- 核心代码function convert2utf8($string) { return iconv(&
- 前言在企业实际应用中,成熟的业务通常数据量都比较大,而单台MySQL服务器在安全性、高可用性和高并发方面都无法满足实际的需求,我们可以在多台
- 数据字典是Oracle存放有关数据库信息的地方,其用途是用来描述数据的。比如一个表的创建者信息,创建时间信息,所属表空间信息,用户访问权限信
- 如:http://localhost/newurl/WebForm1.aspx 1.方法document.URL(注意大小写) 结果是:ht
- 本文实例为大家分享了python实现12306图片验证效果的具体代码,供大家参考,具体内容如下思路:在鼠标点击位置加一个按钮,然后再按钮中的
- MySql 这个数据库绝对是适合dba级的高手去玩的,一般做一点1万篇新闻的小型系统怎么写都可以,用xx框架可以实现快速开发。可是数据量到了
- 前段时间,微信群有一个朋友问了下面这个问题,虽然很简单,但是觉得有必要和大家做一个知识分享。这个问题一共有两个需求:① 获取视频的文件大小;
- 下面的demo是根据需求写的简单测试脚本#!/usr/bin/env python# coding: utf-8# 第一个列表为依赖组件和版
- import numpy as npa = np.array([[1.1,2.1,3.1,4.1],[5,6,7,8],[9,10,11,1
- Ping服务ping 是基于 XML_RPC 标准协议的更新通告服务,用于Blog把内容更新快速通知给搜索引擎,以便搜索引擎及时进行抓取和更