JavaScript自学(1)–前端体系
前端三要素
HTML(结构):超文本标记语言,决定网页的结构和内容
CSS(表现):层叠样式表,设置网页的表现样式
JavaScript(行为):是一种弱类型脚本语言,其源代码不需要经过编译,而是由浏览器解释运行,用于控制网页行为
HTML(结构层)
HTML(HyperTextMarkup Language),超文本标记语言或超文本链接标示语言,是描述网页的一种标准语言,它消除了不同计算机之间信息交流的障碍。HTML凭借它的简易性、可扩展性、平台无关性、通用性在Web前端盛行。
HTML的基本要素分为三种:属性,标签和元素。
CSS(表现层)
CSS层叠样式表是一门标记语言,并不是编程语言,因此不可以自定义变量,不可以引用等,换句话来说就是不具备任何语法支持,它的主要缺陷如下:
- 语法不够强大,比如无法嵌套书写,导致模块化开发中需要书写很多重复的选择器
- 没有变量和合理的样式复用机制,使得逻辑上相关的属性值必须以字面量的形式重复输出,导致难以维护;
这会导致我们在工作中增加了许多工作量,为了解决这个问题,前端开发人员会使用一种称之为【CSS预处理器】的工具,提供CSS缺失的样式层复用机制、减少冗余代码,提高样式的可维护性。大大提高前端在样式的开发效率。
什么是CSS预处理器
CSS处理器预处理器定义了一种新的语言,其基本思想是,是用一种专门的编程语言,为CSS增加一些编程的特性,将CSS作为目标生成文件,然后开发者就只要使用这种语言进行CSS编码工作。总而言之,用一种特定的编程语言,进行web页面样式设计,再通过编译器转化为正常的CSS文件,以供项目使用。
常用的CSS处理器:
- SASS:基于Ruby,通过服务端处理,功能强大。解析效率高。需要学习Ruby语言,上手难度高于LESS。
- LESS:基于NodeJS,通过客户端处理,使用简单。功能比SASS简单,解析效率也低于SASS,但实际开发中足够了,所以一般情况下建议使用LESS。
JavaScript(行为层)
JavaScript是目前web开发中不可缺少的弱类型脚本语言,js不需要编译即可运行,运行在客户端,需要通过浏览器来解析执行JavaScript代码。