你好,我是 winter。
在前面的课程中,我们已经学习了 DOM 相关的 API,狭义的 DOM API 仅仅包含 DOM 树形结构相关的内容。今天,我们再来学习一类新的 API:CSSOM。
我想,你在最初接触浏览器 API 的时候,应该都有跟我类似的想法:“好想要 element.width、element.height 这样的 API 啊”。
这样的 API 可以直接获取元素的显示相关信息,它们是非常符合人的第一印象直觉的设计,但是,偏偏 DOM API 中没有这样的内容。
随着学习的深入,我才知道,这样的设计是有背后的逻辑的,正如 HTML 和 CSS 分别承担了语义和表现的分工,DOM 和 CSSOM 也有语义和表现的分工。
DOM 中的所有的属性都是用来表现语义的属性,CSSOM 的则都是表现的属性,width 和 height 这类显示相关的属性,都属于我们今天要讲的 CSSOM。
顾名思义,CSSOM 是 CSS 的对象模型,在 W3C 标准中,它包含两个部分:描述样式表和规则等 CSS 的模型部分(CSSOM),和跟元素视图相关的 View 部分(CSSOM View)。
在实际使用中,CSSOM View 比 CSSOM 更常用一些,因为我们很少需要用代码去动态地管理样式表。