对于任何一位Web开发者而言，处理CSS样式很多时候还是会借助JavaScript。简单的说，我们会碰到一些交互（或UI效果的变化）都会通过JavaScript来处理style或类。那么今天我们将要学习的是如何通过JavaScript来控制样式和类名，在深入讨论JavaScript处理样式和类的方法之前，我们需要知道在Web页面中元素的样式处理通常有两种方式。

时光如梭，转眼一逝，已经在阿里呆了三年了。在阿里有句话 —— 一年香，三年醇，五年陈。另外还有一句话就是说在阿里，要呆完三年才算是阿里人。自己非常的荣幸，有幸在阿里成功的呆了三年，也有幸成人 —— 成为阿里人。借着这次，对自己在阿里过去的三年光阴做一个简单的整理与总结。就算是对过去三年的复盘吧。

最近项目中使用到一个Loading效果，其实是一个很简单的效果，主要是因为这个Loading出现在不同的场景之中，而且大小也不一致。对于这样的效果，往往都会想通过组件的方式来处理，其出发点就是更易维护，易扩展。当然，这对于前端的同学而言并没有什么复杂性，也没有多少技术含量。不过我还是希望把这个过程记录下来。

Web中使用一些图案做为背景图案是一种时常可见的，早期一般都是通过图片来完成。直至CSS一些新特性更趋成熟和稳定的时候，会通过CSS的相关技术，比如CSS的渐变属性配合background-size之类的来做一些复杂而又美观的Web图案，运用于background-image之中。随着前端技术不断的革新，不久前看到一个生成Web图片的组件：<css-doodle /> —— 使用CSS绘制图案的Web组件！

在上一节中学习了如何通过JavaScript来修改CSS样式。简单地说：查询CSS样式（即计算样式），设置单个样式（设置的是行内样式），设置多个样式（通过类来设置样式）。事实上我们还可以通过脚本化CSS这种技术来控制样式。这种方式，可以让我们的页面更加的快速和高效。那就是直接通过JavaScript动态地添加和删除样式表中的某些样式，用来取代不断地查询DOM元素，并应用各种样式。接下来咱们就来学习脚本化样式表相关的知识。

面对于不同移动设备，特别是针对于屏幕高度的设计和适配，一直是困扰着视觉和前端。特别是设计师和前端开发人员之间的协调，沟通的成本也随着增加。那么这篇文档，主要是用于移动端设计和适配（针对屏幕高度方面），希望通过文档的形式能减少设计师和开发人员之间的一些沟通成本，同时让前端开发人员用最低的时间成本来完成终端设备的UI适配工作。

对于每一位Web开发的同学而言，在CSS的世界当中，每一个元素都是一个盒子，都有描述盒子大小和位置的相关属性。比如CSS的盒模型相关的属性和position相关属性。不过今天我们学习和聊的不是CSS的世界，而是来学习和聊JavaScript中怎么获取元素尺寸和位置。

在上一节中，学习了JavaScript如何获取和设置元素位置和尺寸相关的方法，另外在JavaScript的学习笔记当中也学习了视窗宽度、位置与滚动高度相关的JavaScript方法与属性。今天继续来学习DOM中相关的知识，这篇文章将学习视窗、设备、滚动条和文档等相关的尺寸。其实在前两篇文章中都有涉及这些知识，为了让DOM系列相关的知识更完善，所以再花点时间整理一些这方面的技术点，加强印象。

DOM是JavaScript的基础之一，自己学习DOM的操作也有一段时间了，到今天为止DOM系列的教程刚好有十篇了，这部分都主要是围绕DOM操作的笔记。主要围绕DOM元素的增、删、改、查，DOM节点的操作以及元素尺寸、位置获取和设置等知识。今天这篇文章主要是小结一下。希望对一些像我这样的初学者有所帮助。

如果你浏览过早期的Web网站，或许你已经发现了这些Web站点除了能提供查阅信息之外，无其他作用可言。这样的Web站点其实是非常无聊的。那是因为Web站点没有提供人与机器的互动行为。激不起用户的兴趣。造成这种现象的原因很简单。Web应用程序或者Web站点存应该是为了响应用户对它们所做的事情。好比，我们每天一大早起床时就想好了一天要做些什么，这样每天都有动力，也变得充实。那么在Web应用或Web网站上其实也是类似的，Web网站之后做的事情很大程度上取决于你告诉他们做什么。这样一来，Web网站会变得有趣的多。