HTML 和 JavaScript

对于本书来说,最重要的一个 HTML 标签是<script>。该标签允许我们在文档中包含一段 JavaScript 代码。

  1. <h1>Testing alert</h1>
  2. <script>alert("hello!");</script>

当浏览器在读取 HTML 时,一旦遇到<script>标签就会执行该代码。这个页面在打开时会弹出一个对话框 - alert函数类似prompt,因为它弹出一个小窗口,但只显示一条消息而不请求输入。

在 HTML 文档中包含大程序是不切实际的。<script>标签可以指定一个src属性,从一个 URL 获取脚本文件(包含 JavaScript 程序的文本文件)。

  1. <h1>Testing alert</h1>
  2. <script src="code/hello.js"></script>

这里包含的文件code/hello.js是和上文中相同的一段程序,alert("hello")。当一个页面将其他 URL 引用为自身的一部分时(比如图像文件或脚本),网页浏览器将会立即获取这些资源并将其包含在页面中。

即使script标签引用了一个文本文件,且并未包含任何代码,你也必须使用</script>来闭合标签。如果你忘记了这点,浏览器会将剩余的页面会作为脚本的一部分进行解析。

你可以在浏览器中加载ES模块(参见第 10 章),向脚本标签提供type ="module"属性。 这些模块可以依赖于其他模块,通过将相对于自己的 URL 用作import声明中的模块名称。

某些属性也可以包含 JavaScript 程序。下面展示的<button>标签(显示一个按钮)有一个onclick属性。该属性的值将在点击按钮时运行。

  1. <button onclick="alert('Boom!');">DO NOT PRESS</button>

需要注意的是,我们在onclick属性的字符串中使用了单引号,这是因为我们在使用了双引号来引用整个属性。我们也可以使用&quot;