- HTML+CSS+JavaScript
- Browser
HTML
- 标记语言
- HTML in JavaScript
在JavaScript中，可以通过DOM（文档对象模型）来访问和操作HTML文档的内容。动态地更新页面内容，交互性更强。
- HTML DTD
DTD（文档类型定义）规定了HTML文档的结构和允许使用的标签。
- head标签
head标签用于定义文档的头部信息，包含页面的元数据、外部资源链接和其他一些配置。
- body功能性标签
body标签包含了网页的主要内容
- ARIA
ARIA（可访问性互联网应用程序）是一组属性，用于增强HTML元素的可访问性，使其更易于被屏幕阅读器等辅助技术解释和理解。
- HTML5语义化标签
- HTML5表单增强
引入了新的输入类型和属性，如日期选择、邮箱验证、表单验证等
- HTML5存储
提供Web Storage API，可以在客户端存储数据，包括localStorage和sessionStorage。
- HTML5 IndexedDB
IndexedDB是HTML5提供的客户端数据库，可以用于存储大量结构化数据。
- HTML5 PWA&
PWA（渐进式Web应用程序）和AMP（加速移动页面）是HTML5的两种技术，分别用于提升Web应用的离线访问和提高移动页面加载速度
- HTML5 Audio
嵌入音频
- HTML5 Video
嵌入视频
- HTML5 二进制
支持二进制数据的处理
- HTML5 API
引入了许多新的JavaScript API，用于实现各种功能，如地理位置定位、拖放操作等
- HTML5 Web Worker
Web Worker是在后台运行的JavaScript线程，可以执行耗时操作，而不影响主线程的运行
- HTML5 Web Socket
Web Socket提供了浏览器与服务器之间的全双工通信通道，实现实时通信功能
- HTML5 Shadow DOM
Shadow DOM可以将组件的样式和结构封装起来，避免样式冲突和意外覆盖
- HTML5 Web Componet
Web Component是一种构建可复用组件的技术，包括Custom Elements、Shadow DOM和HTML Templates
- HTML5 SVG&Canvas
SVG（可缩放矢量图形）和Canvas都是用于在网页上绘制图形的技术，SVG是基于矢量图形描述，而Canvas是基于像素的位图
- WebGL & WebGPU
WebGL和WebGPU都是用于在网页上进行高性能图形渲染的技术，前者基于OpenGL ES，后者是新一代的图形渲染API
- HTML5 WebAssembly
WebAssembly是一种低级字节码格式，可以在现代Web浏览器中运行高性能的底层代码
CSS
语法简单，应用可能复杂
掌握各种选择器的使用
CSS in HTML
- inline CSS
- Internal CSS
- External CSS
CSS in JavaScript
- 通过JavaScript操作CSS样式，可以动态地改变页面的外观和布局
JavaScript
- 借鉴C的基本语法
- 借鉴Java的数据类型和内存管理
- 借鉴Scheme，函数提升
- 借鉴Self，基于原型的继承机制
JavaScript in HTML
JavaScript可以直接嵌入在HTML文档中，通过script标签引入
拓展
- 大前端：前端开发在不同终端和平台上的全方位发展和应用
- MVC & MVVM &MVP：都是前端架构模式，用于组织和管理复杂的前端代码，使其更易于维护和扩展。
总结
- HTML、CSS和JavaScript是前端开发的三大基础语言，它们分别负责网页结构、样式和交互功能。需要熟练掌握并能灵活运用。
- 需要注意三剑客的协作使用，有机结合，合理划分职责功能。
- 前端开发是一个不断学习和成长的过程。需要不断地积累实践经验，不断提升自己的技能水平。
