JS中的DOM
认识DOM和BOM
-
前面我们花了很多时间学习JavaScript的基本语法，但是这些基本语法，但是这些语法好像和做网页没有什么关系，和前面学习的HTML、CSS也没有什么关系呢？
- 这是因为我们前面学习的部分属于ECMAScript，也就是JavaScript本身的语法部分
- 除了语法部分之外，我们还需要学习浏览器提供给我们开发者的DOM、BOM相关的API才能对页面、浏览器进行操作
-
前面我们学习了一个window的全局对象，window上事实上就包含了这些内容：
- 我们已经学习了JavaScript语法部分的Object、Array、Date等
- 另外还有DOM、BOM部分
-
DOM：文档对象模型（Document Object Model）
- 简称 DOM，将页面所有的内容表示为可以修改的对象
-
BOM：浏览器对象模型（Browser Object Model）
- 简称 BOM，由浏览器提供的用于处理文档（document）之外的所有内容的其他对象
- 比如navigator、location、history等对象
深入理解DOM
-
浏览器会对我们编写的HTML、CSS进行渲染，同时它又要考虑我们可能会通过JavaScript来对其进行操作：
- 于是浏览器将我们编写在HTML中的每一个元素（Element）都抽象成了一个个对象
- 所有这些对象都可以通过JavaScript来对其进行访问，那么我们就可以通过JavaScript来操作页面
- 所以，我们将这个抽象过程称之为 文档对象模型（Document Object Model）
-
整个文档被抽象到 document 对象中：
- 比如document.documentElement对应的是html元素
- 比如document.body对应的是body元素
- 比如document.head对应的是head元素
-
下面的一行代码可以让整个页面变成红色：
document.body.style.background = "red"
- 所以我们学习DOM，就是在学习如何通过JavaScript对文档进行操作的； (通过浏览器提供给我们的接口实现)
API（Application Programming Interface，应用程序编程接口）是一组预先定义的规则和约定，用于在软件组件、库、框架、操作系统或其他应用程序之间实现通信和互操作。API定义了如何调用和使用各种功能、方法、数据结构等，以便开发者能够更轻松地构建和集成应用程序。
API可以分为以下几类：
库和框架API：这类API提供了特定编程语言的库、框架或SDK中的功能。开发者可以使用这些API构建应用程序，而无需从零开始编写所有代码。例如，React是一个JavaScript库，提供了一组API，用于构建Web应用程序的用户界面。 操作系统API：操作系统（如Windows、macOS、Linux等）提供了一组API，供开发者使用系统资源和功能，例如文件操作、网络通信、硬件访问等。 Web API：Web API通常是一组HTTP端点，允许客户端应用程序（如Web浏览器、移动应用等）与服务器端应用程序进行通信。Web API遵循一定的通信协议，如REST、GraphQL等。客户端可以向服务器发送请求（如GET、POST、PUT、DELETE等HTTP方法），服务器则以特定格式（如JSON、XML等）返回数据。 硬件API：硬件API提供了与外部硬件设备（如打印机、传感器、摄像头等）进行通信和互操作的接口。这些API通常由硬件制造商提供，并支持特定的设备功能。 API的主要优点是将软件的内部实现细节隐藏起来，仅暴露必要的接口。这有助于降低开发复杂性，提高代码可维护性和可重用性。同时，API还可以为不同的编程语言和平台提供兼容性和互操作性。
