**Element** 是一个通用性非常强的基类，所有 [Document](https://developer.mozilla.org/zh-CN/docs/Web/API/Document) 对象下的对象都继承自它。这个接口描述了所有相同种类的元素所普遍具有的方法和属性。一些接口继承自 Element 并且增加了一些额外功能的接口描述了具体的行为。例如， [HTMLElement](https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement) 接口是所有 HTML 元素的基本接口，而 [SVGElement](https://developer.mozilla.org/zh-CN/docs/Web/API/SVGElement) 接口是所有 SVG 元素的基础。大多数功能是在这个类的更深层级（hierarchy）的接口中被进一步制定的。

在 Web 平台的领域以外的语言，比如 XUL，通过 XULElement 接口，同样也实现了 Element 接口。

属性

位置信息属性

[Element.clientHeight](https://developer.mozilla.org/zh-CN/docs/Web/API/Element/clientHeight) 元素 content 内容区域的高度

只读返回[Number](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number) 表示内部相对于外层元素的高度。

只读属性，对于没有定义CSS或者内联布局盒子的元素为0，否则，它是元素内部的高度(单位像素)，包含内边距，但不包括水平滚动条、边框和外边距。

clientHeight 可以通过 CSS height + CSS padding - 水平滚动条高度 (如果存在)来计算.

offsetHeight 元素高度 content + border的高

[Element.scrollHeight](https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollHeight) 表示元素的滚动视图高度

只读返回类型为： [Number](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number)，表示元素的滚动视图高度。

[Element.scrollTop](https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollTop) 表示该元素纵向滚动条距离

返回类型为：[Number](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number) ，表示该元素纵向滚动条距离

[Element.scrollTopMax](https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollTopMax) 只读返回类型为：[Number](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number) ，表示该元素纵向滚动条可移动的最大值

innerWidth

/设置宽度为全屏 width: window.innerWidth,

方法

滚动方法

我们熟知的原生 scroll 方法，大概有这些：

• scrollTo：滚动到目标位置
• scrollBy：相对当前位置滚动
• scrollIntoView：让元素滚动到视野内
• scrollIntoViewIfNeeded：让元素滚动到视野内（如果不在视野内）

以大家用得比较多的 scrollTo 为例，它有两种调用方式：

// 第一种形式
const x = 0, y = 200;
element.scrollTo(x, y);
// 第二种形式
const options = {
  top: 200,
  left: 0,
  behavior: 'smooth'
};
element.scrollTo(options);

而滚动的行为，即方法参数中的 behavior 分为两种：

• auto：立即滚动
• smooth：平滑滚动

除了上述的 3 个 api，我们还可以通过简单粗暴的 scrollTop、 scrollLeft 去设置滚动位置：

// 设置 container 上滚动距离 200
container.scrollTop = 200;
// 设置 container 左滚动距离 200
container.scrollLeft = 200;