                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS动画效果

obj.offsetWidth和obj.style.width变长变短的问题

请问一下为什么一个obj.offsetWidth-1会变长，而obj.style.width-1却变短

Jade2_

2016-08-03

源自：JS动画效果 4-2

关注问题我要回答

1448

操作

收起

2 回答

Collus 回答被采纳 +3 积分
2016-08-03

先明确两个概念：obj.offsetWidth是盒子模型中盒子的宽度（content+2*padding+2*border）。obj.style.width只是content的宽度（即写在CSS样式中的width的值）。假设padding=0，如果设置了宽度为1px的border，那么obj.offsetWidth的值就是content的宽+2px，obj.offsetWidth-1的值就是content的宽+1px.因此会变长。而obj.style.width-1，的值就是content长度减1，所以越来越短。

1 回复有任何疑惑可以回复我~

收起回答

Jade2_ 提问者

非常感谢！

2016-08-04 回复有任何疑惑可以回复我~

唯尔半截湘妃
2016-08-03

obj.offsetWidth获取的是加上边框的width,打个比方，一个div你给它设置div{width:200px; border:1px solid #ccc},它的obj.style.width=200px;而obj.offsetWidth=202px;你把obj.style.width=obj.offsetWidth-1;你算算看，还是变长了1px

1 回复有任何疑惑可以回复我~

收起回答