辨析element.offsetXxxx和element.style.xxxx
DOM操作时,经常使用element.style属性,没错,element.style是属性,和几个offsetXxxx属性一样,概念是一样的。
但是style有几个属性,这几个属性和offsetXxxx有很大关系。他们是可以相互转化的。
之所以说转化,是因为他们的值类型不同,element.offsetXxxx的值类型是Number,并且是整型,比如100。而element.style.xxx是带有单位的字符串,比如100px。
所以要相互转化,要使用parseInt对style的数据进行处理。
但是,并不能保证ele.offsetWidth == ele.style.width
但是,并不能保证ele.offsetWidth == ele.style.width
但是,并不能保证ele.offsetWidth == ele.style.width
其他属性也是这样的,因为要搞清楚offsetWidth的概念。
ele.offsetWidth = parseInt( ele.style.width ) + parseInt(ele.style.borderWidth) + parseInt(ele.style.paddingWidth)。
element.offsetXxxx |
element.style |
element.offsetWidth | element.style.width |
element.offsetHeight | element.style.height |
element.offsetLeft | element.style.left |
element.offsetTop | element.style.top |
辨析element.offsetXxxx和element.style.xxxx的更多相关文章
- Element.querySelector和Element.querySelectorAll和jQuery(element).find(selector)选择器的区别
<divid="test1"> <a href="http://www.hujuntao.com/">设计蜂巢</a> &l ...
- Majority Element(169) && Majority Element II(229)
寻找多数元素这一问题主要运用了:Majority Vote Alogrithm(最大投票算法)1.Majority Element 1)description Given an array of si ...
- python + web自动化,点击不生效,提示“selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element is not clickable at point (117, 674)”
前言: 在做web自动化时,遇到一个缩放了浏览器比例的操作,从100%缩小到80%,再进行点击的时候,弹出报错信息,无法点击 selenium.common.exceptions.ElementCli ...
- LeetCode(169)Majority Element and Majority Element II
一个数组里有一个数重复了n/2多次,找到 思路:既然这个数重复了一半以上的长度,那么排序后,必然占据了 a[n/2]这个位置. class Solution { public: int majorit ...
- Log4j2 - Unable to invoke factory method in class org.apache.logging.log4j.core.appender.RollingFileAppender for element RollingFileAppender for element RollingFile
问题与分析 在使用Log4j2时,虽然可以正确读取配置文件并生成log文件,但偶然发现控制台打印了异常信息如下: 2018-12-31 17:28:14,282 Log4j2-TF-19-Config ...
- 【ESRI论坛6周年征文】ArcEngine注记(Anno/ Label/Element等)处理专题 -入门篇
原发表于ESRI中国社区,转过来.我的社区帐号:jhlong http://bbs.esrichina-bj.cn/ESRI/viewthread.php?tid=122097 ----------- ...
- 关于HTML的Element
今天搞HTML的时候,发现了一些操作element的方法.先引用一篇. 1.document.getElementById(id); 2.document.getElementByTagName(t ...
- Element DOM Tree jQuery plugin – Firebug like functionality | RockingCode
Element DOM Tree jQuery plugin – Firebug like functionality | RockingCode Element DOM Tree jQuery pl ...
- (88)Wangdao.com第二十一天_JavaScript 元素节点Element 节点
Element 节点 (元素节点) 是一组对象 对应网页的 HTML 元素 每一个 HTML 元素,在 DOM 树上都会转化成一个 Element 节点对象(以下简称元素节点) 所有元素节点的 nod ...
随机推荐
- GitHub-创建仓库与本地同步
1. 在Linux上安装Git [root@mini05 ~]# yum install -y git ……………… 2. 本地创建ssh-key信息 [root@mini05 ~]# ssh-key ...
- 简述KVM架构和Xen架构
暑假最后一篇更新,因为,,,明天我就回学校了. 以下均为个人理解,如果有不对的地方还望各位dalao不吝赐教. 虚拟化 虚拟化是通过Hypervisor程序实现的,Hypervisor的作用是将硬件虚 ...
- 7个小技巧,解决eclipse卡顿问题
eclipse作为开发工具,每天都要使用,你肯定遇到过eclipse卡到想哭的时刻,严重影响开发效率啊!如果内存条不要钱,那就加内存吧!一个不够加两个!当然这都是玩笑话,如果不花钱也能解决问题,希望下 ...
- 谱聚类算法(Spectral Clustering)
谱聚类(Spectral Clustering, SC)是一种基于图论的聚类方法--将带权无向图划分为两个或两个以上的最优子图,使子图内部尽量相似,而子图间距离尽量距离较远,以达到常见的聚类的 ...
- 《Java大学教程》—第4章 方法的实现
4.2~3 声明.实现.调用4.4 数据传递:实参.形参.返回值4.6 变量作用域:局部变量(区域内访问).全局变量4.7 重载:运算符重载.方法重载-->多态 1.答:P67方法(method ...
- 【CQOI2011】放棋子
[CQOI2011]放棋子 在一个n行m列的棋盘里放一些彩色的棋子,使得每个格子最多放一个棋子,且不同颜色的棋子不能在同一行或者同一列.有多少种方法? 例如\(,n=m=3\),有两个白棋子和一个灰棋 ...
- php面试题整理(二)
索引,desc 和explain unset只是删除了变量名
- Error response from daemon: rpc error: code = Unknown desc = name conflicts with
环境:centos7 执行一下命令时, docker service create --mode global --name logspout gliderlabs/logspout 出现以下报错: ...
- [1] YOLO 图像检测 及训练
YOLO(You only look once)是流行的目标检测模型之一, 原版 Darknet 使用纯 C 编写,不需要安装额外的依赖包,直接编译即可. CPU环境搭建 (ubuntu 18.04) ...
- 转://Oracle 事务探索与实例(一)
一数据库版本 SYS@LEO1>select* from v$version; BANNER -------------------------------------------------- ...