HTML | DOM 对象高度属性

HTML | DOM 对象高度属性用于返回 HTML 元素的高度值。

内容

HTML | DOM 对象高度属性是 a HTMLElement 对象的属性，其返回指定元素的高度值。该属性会返回元素可见部分的高度，并且包括内边距，但不包括边框、外边距或者水平滚动条（如果存在）。

在 JavaScript 中，可以使用 .height 属性来获取元素的高度值。例如：

let element = document.getElementById("example");
let height = element.height;
console.log(height);

这里获取到了元素 example 的高度，并将其输出至控制台。

示例

在 HTML 中，定义一个元素：

<div id="example" style="height: 500px; background-color: yellow;">This is an example.</div>

在 JavaScript 中获取该元素的高度：

let element = document.getElementById("example");
let height = element.height;
console.log(height);

这段代码将会输出 500。

结论

HTML | DOM 对象高度属性允许开发者获取元素的高度值，这在处理页面布局及响应式设计中十分有用。值得注意的是，获取到的值包括内边距但不包括边框及外边距。