JavaScript中DOM操作之获取元素占位

宽度,高度,margin,padding,border
1.可以通过标签样式来获取
获取到的结果是属性值有px单位

window.getComputedStyle(oDiv).height

2.其他方式
offsetHeight   offsetWidth
宽/高+padding+border
clientHeight   clientWidth
高/宽+padding
clientLeft   clientTop
左/上border
offSetLeft  offSetTop
左/上margin
如果设定了 box-sizing: border-box;
边框线,margin的数据是不受影响的
clientHeight    clientWidth
高/宽 + padding —> width/height - border
实际就是 定义 width/height - border
offsetHeight   offsetWidth
高/宽 + padding + border —> width / height
实际就是 定义的 width / height 数值
边框线和外边距不能设定,要通过style来设定
以下语法形式的设定是没有效果的

oDiv.offsetHeight = ‘300px’;
oDiv.clientHeight = ‘300px’;
oDiv.clientLeft = ‘100px’;
oDiv.offsetLeft = ‘100px’;
style可以设定 boder 和 margin
oDiv.style.borderLeft = ‘100px solid red’;
oDiv.style.marginLeft = ‘100px’;

猜你喜欢

转载自www.cnblogs.com/karl-kidd/p/12602604.html