JS 中offset 的小bug 与解决方案。
一、发现bug准备工作,先定义一个div,然后给div加上样式
效果图如图所示:
二、编写正常的代码,同时给div加上一个id
会发现div图会向左缩进。。。直至消失。
三、添加代码border =1 solid,这时会出现问题。
发现应该缩进的div却是以增长的形式而增加。如图所示:
。
这是为什么呢????画个图看一下

四、解决办法。
不用offset,用自己本身的width。
但是如果使用oDiv.style.width时,style样式只在行间有效。看到这里,也许会有些人会问,什么是行间样式。
行间样式就是直接在div里面定义样式,如
,行间样式看起来没有在<style>标签用的方便,所以我们不想用行间样式,但是却想得到style.width的时候呢?
我们这时候可以采用获取样式的其他方法,currentStyle,还有getComputedStyle.因为兼容关系,我们要编写一个函数,使在浏览器兼容获取样式。
function getStyle(obj,name){
if(obj.currentStyle){
return obj.currentStyle[name];
}else{
return getComputedStyle(obj,false)[name];
}
}
然后再使用该函数
。
然后打开火狐浏览器看一下。发现div模块如我所愿,逐渐减小,而不是逐渐递增。。

JS 中offset 的小bug 与解决方案。的更多相关文章
- IOS9.0中hash值的bug与解决方案
事件起因 事情是这样的:产品上线发布,突然出现了问题.运营Gg过来反应,当场给露珠演示,运营同事的手机是iphone,bug确实是存在的.奇怪的是露珠用了其他iphone手机(借别人的,露珠的是吊死安 ...
- (原创)WinForm中莫名其妙的小BUG——ComboBox 尺寸高度问题
一.前言 使用WinForm很久了,多多少少遇到一些小BUG. 这些小BUG影响并不严重,而且只要稍微设置一下就能正常使用,所以微软也一直没有修复这些小BUG. 本来并不足以写篇文章去记录,但是昨天遇 ...
- (原创)WinForm中莫名其妙的小BUG——RichTextBox自动选择字词问题
一.前言 使用WinForm很久了,多多少少会遇到一些小BUG. 这些小BUG影响并不严重,而且稍微设置一下就能正常使用,而且微软一直也没有修复这些小BUG. 写本系列文章,是为了记录一下这些无伤大雅 ...
- js中setTimeout()的使用bug
今天用setTimeout()时,遇到一个奇怪的现象,通过多方面的查询,最终解决了问题,这是setTimeout()设计的时候存在的一点点bug. 代码的作用主要是在三秒后自动关闭本浏览器窗口: 代码 ...
- JS中toFixed()方法的问题及解决方案
最近发现JS当中toFixed()方法存在一些问题,采用原生的Number对象的原型对象上的toFixed()方法时,规则并不是所谓的“四舍五入”或者是“四舍六入五成双”,所谓“四舍六入五成双”,在百 ...
- js 中的一些小技巧
js 数字操作: 1.1 取整: 取整有很多方法如: parseInt(a,10); Math.floor(a); a>>0; ~~a; a|0; 前面2种是经常用到的,后面3中算是比较偏 ...
- JS中数组方法小总结
1.array.concat(item……) 返回:一个新数组 该方法产生一个新数组,它包含一份array的浅复制,并把一个或多个参数item附加在其后.如果参数item是一个数组,那么它的每个元素会 ...
- js 中继承方式小谈
题外话 前段时间面试中笔试题有这道题目: 请实现一个继承链,要求如下: 构造函数A():构造函数中有consoleA方法,可以实现console.log("a") 实例对象 a:a ...
- js中的变量小例子
s中的变量function foo(){ n=99;}alert(n);//undefined,因为没有调用该函数 function foo(){ n=99;}foo();alert(n);//99, ...
随机推荐
- zabbix自动发现及其自动注册
在大企业环境中,不可能在zabbix页面上逐个添加被监控的主机.还好zabbix自带自动发现和自动注册功能 被监控端安装zabbix客户端之后,将配置文件配置指向服务器端ip即可.红色箭头改为zabb ...
- 洛谷 4115 Qtree4——链分治
题目:https://www.luogu.org/problemnew/show/P4115 论文:https://wenku.baidu.com/view/1bc2e4ea172ded630b1cb ...
- Linux基础入门-目录结构及文件基本操作
一.Linux的目录结构: Windows是以存储介质为主的,主要以盘符及分区来实现文件的管理,然后之下才是目录.但Linux的磁盘从逻辑上来说是挂载在目录上的,每个目录不仅能使用本地磁盘分区的文件系 ...
- CAST()函数可以进行数据类型的转换。
CAST()函数可以进行数据类型的转换. CAST()函数的参数有两部分,源值和目标数据类型,中间用AS关键字分隔. 以下例子均通过本人测试. 一.转换列或值 语法:cast( 列名/值 as 数据类 ...
- Day14全局变量与局部变量
列表的所有方法都可以用,如remove clear 为了避免容易出错,全局变量名用大写,局部变量名用小写 nonlocal指上一级的name
- 移动端css水平垂直居中
水平垂直居中 1.margin 负值调整偏移实现 兼容性: 当前流行的使用方法. <div class="box"> <div class="conte ...
- JRockit Mission Control建立到Tomcat的连接(windows)
http://www.360doc.com/content/10/0928/16/203871_57086538.shtml 蓝海豹 JRockit Mission Control建立到Tomcat ...
- python基础知识11---函数1
函数 一.背景 在学习函数之前,一直遵循:面向过程编程,即:根据业务逻辑从上到下实现功能,其往往用一长段代码来实现指定功能,开发过程中最常见的操作就是粘贴复制,也就是将之前实现的代码块复制到现需功能处 ...
- 招聘IT图书兼职作者(长期兼职)
招聘图书兼职作者(长期兼职),本公司有十多年的计算机图书出版经验,每年出版上百本编程类图书, 和清华大学出版社 电子工业出版社 机械工业出版社都有很好的合作.你可以不用按时上线,不用天天被boss盯着 ...
- EMQ消息队列初体验
使用命令创建admin用户,密码123 emqx_ctl users add admin 配置规则/etc/emqx/acl.conf(除管理员,其他用户只能订阅限定的测试主题路径) %% 允许'ad ...