dom.currentStyle.width/height:获取即时的计算的样式,但是只有IE支持 window.getComputedStyle(dom).width:获取即时计算的样式,支持其他浏览器,兼容性更好 dom.getBoundingClientRect( ).width/height:计算盒模型在页面中的绝对位置,比较少用。 dom.offsetWidth/offect
后来,看了iview的一个组件的源码,看到了getComputedStyle方法获取宽高,对getComputedStyle好奇起来。下面梳理一下,怎么使用js获取元素的宽高的几种比较靠谱的方法。 window.getComputedStyle(dom, null).styleName获取宽高的话,styleName分别对应width、height 返回值: string 兼容性:caniuse.com上面兼容到ie11,我测...
element.clientWidth和element.clientHeight: 获取元素的宽度和高度,包括内边距(padding),但不包括边框(border)、滚动条和外边距(margin)。 element.getBoundingClientRect().width和element.getBoundingClientRect().height: 获取元素的宽度和高度,包括边框,但不包括外边距(margin)。 window.getComputedStyle(element).wid...
IE浏览器: document.documentElement.clientWidth/Height 某些情况下(把<!DOCTYPE html>删掉):document.body.clientWidth/Height 代码语言:javascript 代码运行次数:0 运行 AI代码解释 //封装一个获取页面的可视区域大小getClientSize=function(){return{clientWidth:window.innerWidth||document.documentElement.clientWidth|...
要用JS获得div等元素的高宽:widht、height,不能简单的用obj.style.width或obj.style.height来读取,而是需要用到其他的一些函数:currentStyle()和getComputedStyle()。 如果我单给你这两个函数方法,你可能还不知怎么使用它们。不过没关系,下面实例足够让你理解清楚。
export default { props: { endPoint: { type: Object } }, computed: { endPointWidth: { get() { return this.endPoint.width; }, set(newWidth) { this.$emit('update:endPoint', { ...this.endPoint, width: newWidth }); } }, endPointHeight: { get() { return this.endPoint.height; },...
let element = document.getElementById('myElement'); let rect = element.getBoundingClientRect(); let fullWidthWithMargin = rect.width + window.getComputedStyle(element).marginLeft + window.getComputedStyle(element).marginRight; getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。结合windo...
clientWidth & clientHeight offsetWidth & offsetHeight scrollWidth & scrollHeight getComputedStyle getBoundingClientRect clientWidth & clientHeight The Element.clientWidth property is zero for inline elements and elements with no CSS; otherwise, it's the inner width of an element in pixels. It include...
alert(document.getElementById(“css88″).style.width);//200px alert(document.getElementById(“css88″).style.color);//空白 2.IE中使用的是obj.currentStyle方法，而FF是用的是getComputedStyle 方法 “DOM2级样式”增强了document.defaultView，提供了getComputedStyle()方法。这个方法接受...
因为offsetWidth 会把元素的 width、padding 和 border 都加在一起。 因为元素左右都有 padding 和 border, 所以是:20 + 30 + 100 + 30 + 20 = 200 currentStyle 和 getComputedStyle 用currentStyle 和 getComputedStyle 可以只获取元素的指定样式。