在本 HTML 教程中,您将学习如何在 HTML 中使用 JavaScript。我们还将讨论将 JavaScript 包含在 HTML 中的各种方法。
客户端脚本是一种描述由用户网络浏览器运行的计算机程序的术语。互联网上最广泛使用的客户端脚本语言是 JavaScript (JS)。<script> 元素用于在 HTML 文档中嵌入或引用 JavaScript,以通过向网页添加交互性来改善用户体验。表单验证、生成警报消息、构建图片库、显示隐藏内容、DOM 操作等是 JavaScript 最常见的用途。
JavaScript 可以直接包含在 HTML 页面中,也可以存储在外部脚本文件中并从 HTML 页面内部引用。这两种方法都使用 <script> 元素。
只需将代码添加为 <script> 元素的内容即可将 JavaScript 嵌入 HTML 文档中。
<!DOCTYPE html>
<html>
<head>
<title>Embedding JavaScript</title>
</head>
<body>
<div id="welcome"></div>
<script>
document.getElementById("welcome")[removed] = "Hello World!";
</script>
</body>
</html>
输出
Hello World
您也可以将 JavaScript 代码放在一个不同的文件(带有 .js 后缀)中,并使用 <script> 元素的 src 属性在 HTML 文档中调用该文件。如果您希望同一个脚本出现在多个 HTML 文档中,这是一个不错的选择。它省去了您一遍又一遍地做同样事情的麻烦,并且使您的网站维护起来容易得多。
当给定 src 属性时,<script> 元素必须为空。简而言之,您不能在同一个 <script> 元素中嵌入 JavaScript 并链接到外部 JavaScript 文件。
<!DOCTYPE html>
<html>
<head>
<title>Embedding JavaScript</title>
</head>
<body>
<div id="welcome"></div>
<script src="welcome.js">
</script>
</body>
</html>
输出
Hello World
<noscript> 元素用于为在浏览器中禁用 JavaScript 的用户或使用不支持客户端脚本的浏览器的用户提供替代内容。除了 <script> 之外,此元素可以包含在标准 HTML 页面的 <body> 元素中找到的任何 HTML 组件。
<!DOCTYPE html>
<html>
<head>
<title>Embedding JavaScript</title>
</head>
<body>
<div id="welcome"></div>
<script>
document.getElementById("welcome")[removed] = "Hello World!";
</script>
<noscript>
<p>Oops! This website requires a JavaScript-enabled browser.</p>
</noscript>
</body>
</html>
在上面的示例中,如果浏览器不支持 JavaScript,它将显示 noscript 元素中的内容