在开始讲JavaScript基础之前，让我们先了解一下，我们为什么要学习JavaScript，JavaScript有什么用处：
之前我们学习的HTML写的网页知识静态的，并不能实现响应式的动态化，那么，我们学习JavaScript就是为了实现响应式效果，使 HTML 页面具有动态交互性，例如按钮点击事件、表单验证等，实现各种丰富的网页特效，如轮播图、下拉菜单等。
一、JavaScript的使用
JavaScript有两种使用方式：
第一种就是：在HTML文档中直接添加代码
第二种就是：将JavaScript脚本代码写到外部的JavaScript文件中，再在HTML文档中引用该文件的路径地址。
这两种使用方法效果相同。这与css的使用相同。
内联方式： 将 JavaScript 代码直接写在 HTML 文件中，并使用
<script>标签将其包裹起来。例如：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Inline JavaScript Example</title>
</head>
<body>
<button onclick="alert('Hello, world!')">Click me</button>
<script>
// Inline JavaScript code
console.log('This is an inline JavaScript code.');
</script>
</body>
</html>
外部引用： 将 JavaScript 代码保存在一个独立的 .js 文件中，然后在 HTML 文件中使用
<script>标签引用该文件。例如：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>External JavaScript Example</title>
<!-- 引用外部 JavaScript 文件 -->
<script src="script.js"></script>
</head>
<body>
<button onclick="sayHello()">Click me</button>
</body>
</html>
其中，
script.js文件包含以下 JavaScript 代码：// script.js function sayHello() { alert('Hello, world!'); }无论是内联还是外部引用方式，都可以让 HTML 文件与 JavaScript 代码分离，使得代码结构更清晰，易于维护。
在 HTML 中使用内联方式引入 JavaScript 时，<script> 标签可以放置在 <head>、<body>或者 <html>标签内部的任何位置。同一个HTML网页也允许在不同位置放入多段JavaScript代码。
JavaScript 代码会在浏览器解析到 `<script>` 标签时执行。通常情况下，如果需要在页面加载前执行 JavaScript，可以将 `<script>` 标签放在 `<head>` 标签内，如果需要在页面加载后执行 JavaScript，可以将 `<script>` 标签放在 `<body>` 结尾处，这样可以确保页面内容先加载完成，再执行 JavaScript，以提高用户体验。
注意：
在 HTML 中，使用 CSS 文件和 JavaScript 文件的引用方式是不同的。
使用 CSS 文件的引用方式通常是通过<link>标签，示例如下：
<link rel="stylesheet" type="text/css" href="style.css">其中，rel属性指定链接的关系为样式表，type属性指定文件类型为 CSS，href属性指定 CSS 文件的路径。
而使用 JavaScript 文件的引用方式通常是通过<script>标签，示例如下：
<script src="script.js"></script>其中，src属性指定 JavaScript 文件的路径。
这种方式可以将 CSS 和 JavaScript 的代码分离到单独的文件中，有利于代码的组织和维护。