你好，世界！

本教程的这一部分是关于核心 JavaScript，即语言本身。

但是我们需要一个工作环境来运行我们的脚本，并且由于本书是在线提供的，因此浏览器是一个不错的选择。我们将把特定于浏览器的命令（如 alert）的数量保持在最低限度，这样如果你计划专注于其他环境（如 Node.js），就不会在它们上面花费时间。我们将在教程的下一部分中关注浏览器中的 JavaScript。

因此，首先，让我们看看如何将脚本附加到网页。对于服务器端环境（如 Node.js），你可以使用 "node my.js" 之类的命令执行脚本。

“script” 标签

可以使用 <script> 标签将 JavaScript 程序插入到 HTML 文档中的几乎任何位置。

例如

<!DOCTYPE HTML>
<html>

<body>

  <p>Before the script...</p>

  <script>
    alert( 'Hello, world!' );
  </script>

  <p>...After the script.</p>

</body>

</html>

您可以通过单击上方框右上角的“播放”按钮来运行示例。

<script> 标签包含 JavaScript 代码，当浏览器处理该标签时，该代码会自动执行。

现代标记

<script> 标签有一些现已很少使用的属性，但仍然可以在旧代码中找到

type 属性：<script type=…>

旧的 HTML 标准 HTML4 要求脚本具有 type。通常为 type="text/javascript"。现在不再需要了。此外，现代 HTML 标准完全改变了此属性的含义。现在，它可用于 JavaScript 模块。但这是一个高级主题，我们将在本教程的另一部分中讨论模块。

language 属性：<script language=…>

此属性旨在显示脚本的语言。此属性不再有意义，因为 JavaScript 是默认语言。无需使用它。

脚本前后的注释。

在非常古老的书籍和指南中，您可能会在 <script> 标签内找到注释，如下所示

          <script type="text/javascript"><!--
    ...
//--></script>
        

此技巧在现代 JavaScript 中不再使用。这些注释向不知道如何处理 <script> 标签的旧浏览器隐藏了 JavaScript 代码。由于在过去 15 年中发布的浏览器不存在此问题，因此此类注释可以帮助您识别非常旧的代码。

外部脚本

如果我们有大量的 JavaScript 代码，我们可以将其放入一个单独的文件中。

脚本文件使用 src 属性附加到 HTML

<script src="/path/to/script.js"></script>

此处，/path/to/script.js 是从网站根目录到脚本的绝对路径。还可以提供从当前页面开始的相对路径。例如，src="script.js"，就像 src="./script.js" 一样，表示当前文件夹中的文件 "script.js"。

我们也可以提供一个完整的 URL。例如

          <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>
        

要附加多个脚本，请使用多个标签

          <script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…
        

通常，只有最简单的脚本才会放入 HTML 中。更复杂的脚本驻留在单独的文件中。

单独文件的优点是浏览器会下载它并将其存储在其缓存中。

引用同一脚本的其他页面将从缓存中获取它，而不是下载它，因此该文件实际上只下载一次。

这减少了流量并使页面加载更快。

单个 <script> 标记不能同时具有 src 属性和内部代码。

此方法不起作用

          <script src="file.js">
  alert(1); // the content is ignored, because src is set
</script>
        

我们必须选择外部 <script src="…"> 或带有代码的常规 <script>。

上面的示例可以拆分为两个脚本以使其工作

          <script src="file.js"></script>
<script>
  alert(1);
</script>
        

总结

我们可以使用 <script> 标记向页面添加 JavaScript 代码。
type 和 language 属性不是必需的。
可以使用 <script src="path/to/script.js"></script> 插入外部文件中的脚本。

还有很多关于浏览器脚本及其与网页交互的内容需要学习。但请记住，本教程的这一部分专门针对 JavaScript 语言，因此我们不应该让它与浏览器对它的特定实现分散我们的注意力。我们将使用浏览器作为运行 JavaScript 的一种方式，这对于在线阅读非常方便，但只是众多方式之一。

“script” 标签

现代标记

外部脚本

总结

任务

显示警报

使用外部脚本显示警报

评论

章节

课程导航