Js获取DOM元素宽高，Js获取不到DOM元素宽高

dom及css样式如下：

方法1: element.style.width/height

const el = document.getElementById('element');
console.log(el.style.width); // "" style对象取不到 style标签中定义的样式
console.log(el.style.height); // “100px”

⚠️注意：style对象只能获取内联样式（dom中的style里的样式）

方法2: window.getComputedStyle(element).width/height

const el = document.getElementById('element');
console.log(window.getComputedStyle(el).width); // "100px"
console.log(window.getComputedStyle(el).height); // "100px"

注意：window.getComputedStyle()可以实时获得style属性

方法3: Element.getBoundingClientRect().width/height

const el = document.getElementById('element');
console.log(el.getBoundingClientRect().width); // "100px"
console.log(el.getBoundingClientRect().height); // "100px"

注意：此方法除了能获取宽高，还能获取元素位置等信息

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！