# 前端语言的基本能力
前端三剑客：HTML CSS JavaScript 同等重要，缺一不可。
# HTML（超文本标记语言）
用于定义网页结构和内容。HTML 是一种用于创建网页的标记语言。它由一系列标签（tag）组成，这些标签用于描述网页的结构和内容。HTML 标签告诉浏览器如何显示网页的各个部分，包括文字、图像、链接、表格等。
HTML 是构建万维网的基础，与 CSS 和 JavaScript 等其他技术一起，可以创建出各种丰富多样的网页和交互式应用程序。
# CSS （层叠样式表）
CSS 是一种用于描述网页样式和布局的样式表语言，与 HTML 结合使用。CSS 可以对 HTML 文档中的字体、颜色、大小、间距、背景、边框等元素的样式进行设置。CSS 使用选择器（selector）来选择要应用样式的 HTML 元素，并使用属性 - 值对来定义具体的样式。
CSS 为网页设计和开发提供了强大的样式控制能力，使得网页可以呈现出各种各样的视觉效果和交互效果。
# JavaScript
JavaScript 是一种用于为网页添加交互性和动态效果的脚本语言。它可以嵌入到 HTML 文档中，通过与 HTML 和 CSS 结合使用，实现对网页内容和样式的动态修改、用户交互和数据处理等功能。
特点：
1. 借鉴 C 语言的基本语法；
2. 借鉴 Java 语言的数据类型和内存管理；
3. 借鉴 Scheme 语言，将函数提升到 “第一等公民”（First class）的地位 ；
4. 借鉴 Self 语言，使用基于原型（Prototype）的继承机制。
# 三种语言在浏览器中运行流程
# 前端语言的协作配合
JavaScript event loop 机制，先执行微任务，再执行宏任务
# 你不知道的 HTML
# H5 新增语义化标签
常见的 HTML5 新增语义化标签：
<article>：表示一个独立的内容块。<aside>：定义一个附属信息的区域。<details>：表示用户可以查看或隐藏的补充信息。<figcaption>：为图片或图表添加标题。<figure>：用于组合一组相关元素，例如图表和其标题。<footer>：定义文档的页脚。<header>：定义文档的页眉。<main>：代表文档或应用程序的主要内容。<nav>：用于定义导航链接集合的部分。<section>：用于划分页面上的段落、主题、内容区块等。
用比不用好，不用比用错好
# H5 存储
HTML5 引入了两种新的客户端存储技术：Web 存储和 IndexedDB。
# Web 存储
Web 存储包括 localStorage 和 sessionStorage 两种，可以保存在浏览器端，不需要每次向服务器请求数据，提高了网页加载速度。这两种存储方式都是以 key-value 对的形式进行存储，并且只能存储字符串类型的数据。
# IndexedDB
IndexedDB 是浏览器中另一种存储机制，它是一种更灵活的对象数据库，允许存储非字符串类型的数据，例如 Blob 和 ArrayBuffer 等。
IndexedDB 使用异步 API 进行操作，需要使用数据库、事务、对象存储区域等概念。
# 拓展交流
# 课程总结
这节课简要介绍了前端三剑客的能力，归纳为 HTML - 结构，CSS - 外表，JavaScript - 功能，这三剑客的结合使用可以实现丰富多彩的前端页面。
此外本节课还介绍了三种语言在浏览器中的运行流程和它们配合，拓展了 H5 相关的内容。
总之想学好前端，就必须打好三件套的基础，并了解前端技术原理及其发展，积极学习相关技术。
