2021前端面试深度解析：DOM、BOM、CSS、HTML与JS核心知识点

"这是一份2021年的前端面试题集，涵盖了前端开发中的各个方面，包括BOM和DOM操作，HTML与CSS的基础知识，JavaScript基础以及异步处理等核心内容。" 这篇文档主要涉及了前端开发的重要知识点，以下是详细说明： **BOM (浏览器对象模型) & DOM (文档对象模型)** 1. **BOM事件**：指的是浏览器窗口、窗口部件（如按钮、链接等）上触发的事件，如`window.onload`、`window.resize`等。 2. **BOM事件处理程序**：用来监听和处理这些事件的函数，如`addEventListener`、`removeEventListener`。 3. **BOM对象**：包括`history`、`location`和`document`等，它们提供了对浏览器状态和页面内容的操作接口。 **DOM操作** 1. **DOM节点**：HTML文档中的每个元素、属性、文本等都是一个DOM节点，可以被程序操作。 2. **获取节点**：通过`getElementById`、`getElementsByClassName`、`getElementsByTagName`等方法来获取。 3. **创建和插入节点**：使用`createElement`创建新节点，`appendChild`、`insertBefore`进行插入操作。 4. **DOM0级和DOM2级**：DOM0级是早期的事件处理方式，直接在元素上绑定函数；DOM2级引入了`addEventListener`和`removeEventListener`，支持事件冒泡和捕获。 **HTML与CSS** 1. **CSS盒子模型**：描述了元素的尺寸，包括内容、内边距、边框和外边距。 2. **BFC（块格式化上下文）**：用于确定元素如何在其内部和外部元素中布局。 3. **标签语义化**：使用有意义的HTML标签提高网页结构的可读性和可访问性。 4. **CSS新特性**：例如，CSS3引入了新的选择器、动画、转换、过渡、多列布局等。 **JavaScript基础** 1. **闭包**：一个函数能够访问并操作其外部变量，即使在其外部函数已经执行完毕后。 2. **数据类型**：包括基本类型（如字符串、数字、布尔值等）和引用类型（如对象）。 3. **作用域**：变量在何处可见和可访问，分为全局作用域和局部作用域。 4. **执行上下文**：JavaScript代码执行时的环境，分为全局执行上下文和函数执行上下文。 5. **异步编程**：非阻塞的编程模式，如回调函数、Promise、async/await等。 **浏览器通信** 1. **标签页间通信**：使用`localStorage`、`sessionStorage`、`Broadcast Channel API`或`postMessage`实现。 **JavaScript进阶** 1. **同步和异步**：同步执行代码按顺序进行，异步则不等待某个操作完成即可继续执行其他代码。 2. **AJAX**：异步JavaScript和XML，用于在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。 3. **Promise**：用于处理异步操作的对象，提供了更好的错误处理和链式调用。 这份面试题集旨在帮助开发者复习前端基础知识，准备面试，同时也可作为自我提升的参考资料。