innerHTML在JS是双向功能:获取对象的内容 或 向对象插入内容
offsetWidth
对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变
offsetWidth = width + padding + border
style.width也是当前对象的宽度(width+padding+border)。
1)style.width返回值除了数字外还带有单位px;
2)如对象的宽度设定值为百分比宽度,则无论页面变大还是变小,style.width都返回此百分比,而offsetWidth则返回在不同页面中对象的宽度值而不是百分比值;
3)如果没有给 HTML 元素指定过 width样式,则 style.width 返回的是空字符串;
clientWidth 是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。 offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。
offsetHeight
Height+padding+border
当前对象的高度。
style.height也是当前对象的高度(height+padding+border)
1)style.height返回值除了数字外还带有单位px;
2)如对象的高度设定值为百分比高度,则无论页面变高还是变矮 style.height都返回此百分比,而offsetHeight则返回在不同页面中对象的高度值而不是百分比值;
3)如果没有给 HTML 元素指定过 height样式,则 style.height返回的是空字符串;
offsetLeft
当前对象到其上级层左边的距离。
不能对其进行赋值.设置对象到其上级层左边的距离请用style.left属性。
style.left当前对象到其上级层左边的距离。
1)style.left返回值除了数字外还带有单位px;
2)如对象到其上级层左边的距离设定值为百分比,style.left返回此百分比,而offsetLeft则返回到其上级层左边的距离的值;
3)如果没有给 HTML 元素指定过 left样式,则 style.left返回的是空字符串;
offsetTop
当前对象到其上级层顶部边的距离。
不能对其进行赋值.设置对象到上级层顶部边的距离请用style.top属性。
style.top当前对象到其上级层顶部边的距离。
1)style.top返回值除了数字外还带有单位px;
2)如对象到其上级层顶部边的距离设定值为百分比,style.top返回此百分比,而offsetTop则返回到其上级顶部边的距离的值;
3)如果没有给 HTML 元素指定过 top样式,则 style.top返回的是空字符串;