前端语言的基本能力
基础的前端三剑客HTML、CSS、JavaScript
- HTML(超文本标记语言) : HTML 是 Web 页面的基础结构。它用于描述网页的内容和结构。HTML 使用一系列标记(称为标签)来定义页面元素,如标题、段落、列表、图片和链接等。浏览器解析 HTML 代码,并根据标签的语义来显示页面内容。HTML 为网页提供了基本的骨架,使浏览器能够呈现文本、图像和其他媒体。
- CSS(级联样式表) : CSS 用于描述 HTML 元素的外观和布局。CSS 允许我们定义如何显示 HTML 元素,例如字体、颜色、大小、间距等。通过使用 CSS,我们可以将样式与 HTML 结构分离,使得网站的设计和维护更加简便。CSS 还允许我们根据不同的设备和屏幕尺寸应用不同的样式(媒体查询),以实现响应式设计。
- JavaScript: JavaScript 是一种脚本语言,用于在浏览器中增加交互性和动态效果。它允许我们编写脚本来处理用户操作,例如点击按钮、输入表单、拖动元素等。通过使用 JavaScript,我们也可以操作 HTML 和 CSS,动态更改页面内容和样式,从而提供丰富的用户体验。JavaScript 也可以与服务器进行通信,以便在不刷新整个页面的情况下获取或提交数据(例如,通过 AJAX)。
HTML
对于HTML是什么,MDN是这样定义的:
HTML 不是一门编程语言,而是一种用于定义内容结构的标记语言。HTML 由一系列的元素组成,这些元素可以用来包围不同部分的内容,使其以某种方式呈现或者工作。一对标签可以为一段文字或者一张图片添加超链接,将文字设置为斜体,改变字号,等等。
CSS
和 HTML 类似,CSS 也不是真正的编程语言,甚至不是标记语言。它是一门样式表语言,这也就是说人们可以用它来选择性地为 HTML 元素添加样式。
常见选择器
选择器名称 | 选择的内容 | 示例 |
---|---|---|
元素选择器(也称作标签或类型选择器) | 所有指定 (该) 类型的 HTML 元素 | p 选择 <p> |
ID 选择器 | 具有特定 ID 的元素(单一 HTML 页面中,每个 ID 只对应一个元素,一个元素只对应一个 ID) | #my-id 选择 <p id="my-id"> 或 <a id="my-id"> |
类选择器 | 具有特定类的元素(单一页面中,一个类可以有多个实例) | .my-class 选择 <p class="my-class"> 和 <a class="my-class"> |
属性选择器 | 拥有特定属性的元素 | img[src] 选择 <img src="myimage.png"> 而不是 <img> |
伪(Pseudo)类选择器 | 特定状态下的特定元素(比如鼠标指针悬停) | a:hover 仅在鼠标指针悬停在链接上时选择 <a> 。 |
JavaScript的七种基本数据类型:
这些类型分为两大类:原始类型(Primitive)和对象类型(Object)。
- Number(数字): Number 类型用于表示整数和浮点数。在 JavaScript 中,所有数字都是双精度浮点数(64位),遵循 IEEE 754 标准。这意味着 JavaScript 中并没有真正的整数类型。另外,Number 类型还包括特殊值如:Infinity(正无穷大)、-Infinity(负无穷大)和 NaN(非数值)。
- String(字符串): String 类型表示一串字符。在 JavaScript 中,字符串是不可变的,这意味着一旦创建了一个字符串,就不能对其内容进行修改。字符串可以用单引号、双引号或反引号(模板字符串)括起来。
- Boolean(布尔值): Boolean 类型只有两个值:true(真)和 false(假)。布尔值通常用于表示条件、逻辑操作或比较的结果。
- Null(空值): Null 类型只有一个值:null。它表示一个空值或不存在的引用。通常用于表示变量没有被赋值,或表示一个空对象。
- Undefined(未定义): Undefined 类型只有一个值:undefined。当一个变量声明了,但尚未赋值时,其默认值为 undefined。它表示变量的值尚未确定。
- Symbol(符号): Symbol 类型是 ECMAScript 6(ES2015)引入的新类型。Symbol 类型的值是唯一且不可变的,主要用于创建对象的唯一属性名,以防止属性名冲突。
- Object(对象): Object 类型用于表示复杂的数据结构,如对象、数组和函数。对象是键值对的集合,键是字符串,值可以是任何数据类型。数组是值的有序集合,而函数是可调用的代码块。
在 JavaScript 中,原始类型(Number、String、Boolean、Null、Undefined 和 Symbol)是不可变的基本数据类型,而对象类型(Object)是可变的引用数据类型