一、发现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. Pac-Man 吃豆人

    发售年份 1980 平台 街机 开发商 南梦宫(Namco) 类型 迷宫 https://www.youtube.com/watch?v=dScq4P5gn4A

  2. Mysql ssl 连接

    在Azure创建了一个Mysql5.7服务,因为默认使用ssl连接,需要下载Azure的证书,并使用openssl生成客户端的证书.具体流程参考官方文档 大致步骤: 下载根证书, 安装openssl, ...

  3. 漫画|Linux 并发、竞态、互斥锁、自旋锁、信号量都是什么鬼?(转)

    知乎链接:https://zhuanlan.zhihu.com/p/57354304 1. 锁的由来? 学习linux的时候,肯定会遇到各种和锁相关的知识,有时候自己学好了一点,感觉半桶水的自己已经可 ...

  4. Excel文件上传,高亮错误的行和列

    /// <summary> /// Excel模板写入错误信息 /// </summary> /// <param name="fileName"&g ...

  5. docker systemctl无法使用

    Dockerfile for systemd base image FROM centos:7 ENV container docker RUN (cd /lib/systemd/system/sys ...

  6. Winfrom BackgroundWorker

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Reflection ...

  7. git 常用命令思维导图

  8. 工控随笔_18_西门子_WinCC的VBS脚本_07_变量作用域和传值、传址

    在vbs脚本中也存在和其他编程语言一样的概念,那就是变量的作用域,变量的作用域决 定在什么范围内可以访问. 同样的在vbs脚本中对于变量也有一个生命周期, 变量的生命周期决定了变量的存续时间 这个主要 ...

  9. 使用Netty开发RPC的技术原理

    本片文字摘抄自https://www.cnblogs.com/jietang/p/5615681.html 1.定义RPC请求消息.应答消息结构,里面要包括RPC的接口定义模块,包括远程调用的类名.方 ...

  10. Realm 处理List<String> 问题 Type parameter 'java.lang.String' is not within its bound; should implement 'io.realm.RealmModel

    public class InitAppBean extends RealmObject { private String sapling; private String logistics; pri ...