JavaScript border与offsetWidth

我就是我 2024-02-17 21:08 47阅读 0赞

*  为什么在样式中加了border之后方块会不断变宽而不是变窄？

style.width : width  
offsetWidth : style.width + padding + border  
随着时间的变化，可以列出这样一个表格：

style.width        border     offsetWidth
    ①       200              2         202(200+2)
    ②       201(202-1)       2         203(201+2)
    ②       202(203-1)       2         204(202+2)
                …………………………………………

可以看出offsetWidth是不断增大的  
1.offsetWidth属性可以返回对象的padding+border+width属性值之和，style.width返回值就是定义的width属性值。

2.offsetWidth属性仅是可读属性，而style.width是可读写的。

3.offsetWidth属性返回值是整数，而style.width的返回值是字符串。

4.style.width仅能返回以style方式定义的内部样式表的width属性值。

*  如何获取style行内样式（而不把style写在行内样式里）？  
    （这问题表达不清楚= =）

function getStyle(obj,attr){
        
        if(obj.currentStyle){       //IE
            return obj.currentStyle[attr];
        }else{                                  //其他浏览器
            return getComputedStyle(obj,false)[attr];
        }
    }