js中box.style.left和box.offsetLeft区别

  • 2019-01-09 9:23:58
  • 3,325 次阅读
  • 稿源:天马行空

这两个属性各不相同,用法也不一样。可能会有人把这两个属性混淆,而导致做的特效没有反应。为了更好的理解区分它俩,下面具体内容如下。

(1)区别之一:在没有定位的情况下,offsetLeft可以返回没有定位盒子的距离左侧的位置,而style.left是不可以的。

style.left

(2)区别之二:offsetTop返回的值是数字本身,如100;而style.left返回的值是字符串而且只能获得行内样式的值,除了数字外还附带一个px,如100px,所以它不能进行加减运算,需要转化为数字,用parseInt(标签.style.left)。例如,parseInt(“100px”)转化为数字100。

(3)区别之三:offsetLeft只读,可以随时随刻检测盒子距离左侧位置,而style.left可读写。在这里只读意识就是,可以获取元素,但一定不能赋值。

(4)区别之三:如果没给HTML元素指定过top或left样式,则 style.top或style.left 返回的是空字符串。

喜欢 3

文章评论 (0)

表情

大眼 可爱 大笑 坏笑 害羞 发怒 折磨 快哭了 大哭 白眼 晕 流汗 困 腼腆 惊讶 憨笑 色 得意 骷髅 囧 睡觉 眨眼 亲亲 疑问 闭嘴 难过 淡定 抗议 鄙视 猪头