一、发现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 与解决方案。的更多相关文章

  1. IOS9.0中hash值的bug与解决方案

    事件起因 事情是这样的:产品上线发布,突然出现了问题.运营Gg过来反应,当场给露珠演示,运营同事的手机是iphone,bug确实是存在的.奇怪的是露珠用了其他iphone手机(借别人的,露珠的是吊死安 ...

  2. (原创)WinForm中莫名其妙的小BUG——ComboBox 尺寸高度问题

    一.前言 使用WinForm很久了,多多少少遇到一些小BUG. 这些小BUG影响并不严重,而且只要稍微设置一下就能正常使用,所以微软也一直没有修复这些小BUG. 本来并不足以写篇文章去记录,但是昨天遇 ...

  3. (原创)WinForm中莫名其妙的小BUG——RichTextBox自动选择字词问题

    一.前言 使用WinForm很久了,多多少少会遇到一些小BUG. 这些小BUG影响并不严重,而且稍微设置一下就能正常使用,而且微软一直也没有修复这些小BUG. 写本系列文章,是为了记录一下这些无伤大雅 ...

  4. js中setTimeout()的使用bug

    今天用setTimeout()时,遇到一个奇怪的现象,通过多方面的查询,最终解决了问题,这是setTimeout()设计的时候存在的一点点bug. 代码的作用主要是在三秒后自动关闭本浏览器窗口: 代码 ...

  5. JS中toFixed()方法的问题及解决方案

    最近发现JS当中toFixed()方法存在一些问题,采用原生的Number对象的原型对象上的toFixed()方法时,规则并不是所谓的“四舍五入”或者是“四舍六入五成双”,所谓“四舍六入五成双”,在百 ...

  6. js 中的一些小技巧

    js 数字操作: 1.1 取整: 取整有很多方法如: parseInt(a,10); Math.floor(a); a>>0; ~~a; a|0; 前面2种是经常用到的,后面3中算是比较偏 ...

  7. JS中数组方法小总结

    1.array.concat(item……) 返回:一个新数组 该方法产生一个新数组,它包含一份array的浅复制,并把一个或多个参数item附加在其后.如果参数item是一个数组,那么它的每个元素会 ...

  8. js 中继承方式小谈

    题外话 前段时间面试中笔试题有这道题目: 请实现一个继承链,要求如下: 构造函数A():构造函数中有consoleA方法,可以实现console.log("a") 实例对象 a:a ...

  9. js中的变量小例子

    s中的变量function foo(){ n=99;}alert(n);//undefined,因为没有调用该函数 function foo(){ n=99;}foo();alert(n);//99, ...

随机推荐

  1. 面向对象编程导论 An Introduction to Object-Oriented Programming (Timothy 著)

    第1章 面向对象思想 第2章 抽象 第3章 面向对象设计 第4章 类和方法 第5章 消息,实例和初始化 第6章 案例研究: 八皇后问题 第7章 研究研究: 台球游戏 第8章 继承与替换 第9章 案例研 ...

  2. Java 静态代码的作用

    public student{ private static int MAXNUM=100; static{ System.out.println(MAXNUM); } student(){ Syst ...

  3. day059-60 ajax初识 登录认证练习 form装饰器, form和ajax上传文件 contentType

    一.ajax 的特点 1.异步交互:客户端发出一个请求后,需要等待服务器响应结束后, 才能发出第二个请求 2.局部刷新:给用户的感受是在不知不觉中完成请求和响应过程. 二.ajax 模板示例 ($.a ...

  4. 常用oracle中系统表查询语句

    sqlplus / as sysdbaSQL>select status from v$instance;1.查看最大连接数show parameter processes;2.查询oracle ...

  5. 剑指offer 5.栈和队列 用两个栈实现队列

    题目描述 用两个栈来实现一个队列,完成队列的Push和Pop操作. 队列中的元素为int类型.   解题思路:1,整体思路是元素先依次进入栈1,再从栈1依次弹出到栈2,然后弹出栈2顶部的元素,整个过程 ...

  6. CentOS下Redis的安装(转)

    目录 CentOS下Redis的安装 前言 下载安装包 解压安装包并安装 启动和停止Redis 启动Redis 停止Redis 参考资料 CentOS下Redis的安装 前言 安装Redis需要知道自 ...

  7. 梯度消失(vanishing gradient)和梯度爆炸(exploding gradient)

    转自https://blog.csdn.net/guoyunfei20/article/details/78283043 神经网络中梯度不稳定的根本原因:在于前层上的梯度的计算来自于后层上梯度的乘积( ...

  8. Tomcat 启动报错:host-manager does not exist or is not a readable directory

    http://blog.csdn.net/yh88356656/article/details/50519120 新安装一个Tomcat,我们肯定会删除Tomcat Webapps下的自带项目,在考入 ...

  9. ios中[UIScreen mainscreen].bounds 的大小是由什么决定的?

    ios中经常会用[UIScreen mainScreen].bounds 来获取屏幕的frame,但最近网上下载了个项目,在模拟器运行起来,打印[UIScreen mainScreen].bounds ...

  10. StringRedisTemplate常用操作

    stringRedisTemplate.opsForValue().set("test", "100",60*10,TimeUnit.SECONDS);//向r ...