JavaScript 学习笔记之基础中的基础

概要：javascript的组成、 各个组成部分的作用 、 一、javascript的组成   javascript  ECMAScript（核心） DOM（文档对象模型） BOM（浏览器对象模型） 1.1ECMAScript 　　ECMAScript是通过ECMA-262标准化的脚本语言，ECMA-262规定语言的：语法、类型、语句、关键字、保留字、操作符、对象 1.2 DOM 　　DOM把整个页面映射为一个多层节点结构，HTML或者XML等页面中的每个组成部分都是某种类型的节点，这些节点又包含不同类型的数据。 1.3 BOM 　　控制浏览器显示的页面以外的部分 二、[removed]元素 JavaScript是Web开发中不可或缺的一部分，尤其对于前端开发者来说，它的重要性不言而喻。这篇学习笔记将带你深入了解JavaScript的基础知识，包括它的组成、主要组成部分的作用，以及如何在HTML中使用`<script>`元素。 JavaScript由三个主要部分组成： 1. **ECMAScript (ES)**：这是JavaScript的核心，它定义了语言的语法、数据类型、语句、关键字、保留字、运算符以及对象。ECMAScript的标准由ECMA-262文档定义，随着技术的发展，ES有多个版本，如ES5、ES6（也称ES2015）、ES7（ES2016）等，每个新版本都增加了新的特性和功能。 2. **DOM (Document Object Model)**：DOM是一种用于表示HTML或XML文档的树形结构，允许程序和脚本动态更新、添加、删除和改变任何元素和属性。通过DOM，JavaScript可以与网页内容进行交互，实现动态效果。 3. **BOM (Browser Object Model)**：BOM允许JavaScript访问和控制浏览器的功能，如窗口、导航、历史记录和屏幕信息等，它并不受ECMAScript标准控制，而是由各个浏览器厂商实现。 接下来，我们看看`<script>`元素的使用： **2.1 使用方式**： - **外部引用**：通过`src`属性，可以将JavaScript代码放在单独的.js文件中，然后在HTML中引用，这样可以提高页面加载速度，因为浏览器可以并行下载多个外部脚本。 ```html <script type="text/javascript" src="../../XX.js"></script> ``` - **内联脚本**：直接在HTML中插入JavaScript代码，方便调试，但会增加HTML文件大小，影响页面加载速度。 ```html <script type="text/javascript"> var first = "第一个变量"; alert(first); </script> ``` **2.2 `<script>`元素的属性**： - **defer**：这个属性告诉浏览器延迟执行脚本，直到整个HTML文档被解析完成。适用于外部脚本，可以提高页面渲染速度，因为脚本不会阻塞DOM的构建。 ```html <script type="text/javascript" defer="defer" src="demo.js"></script> ``` - **async**：异步脚本不会阻塞HTML解析，允许脚本并行下载。异步脚本的执行顺序不可预测，因此，如果脚本依赖于DOM或其他脚本，不推荐使用async。 ```html <script type="text/javascript" async="async" src="demo1.js"></script> <script type="text/javascript" async="async" src="demo2.js"></script> ``` 理解这些基础知识是JavaScript学习的第一步。只有打牢基础，才能更好地掌握更高级的概念，如闭包、原型链、异步编程、模块化等，进一步提升你的编程技能。记住，编程的学习是一个渐进的过程，耐心和实践是关键。希望这篇笔记能帮助你在JavaScript的世界里迈开坚实的一步！