HTML - script 标签



HTML <script> 标签用于声明客户端脚本 (JavaScript)。标记可能包含指向包含脚本的外部文件的链接,也可以包含脚本本身。

script 标签用于定义用于图像操作、表单验证和动态内容更新的客户端脚本。src 属性允许您指定外部文件的位置。

HTML <script> 标签可以放在 <head> 和 <body> 元素中。

尽管脚本在 HTML 文档中的位置不会影响其执行方式,但必须首先运行的脚本必须放在文档的标题中。

HTML 文档可以包含  <script> 标签的多个实例。

语法  


<script> .... </script>

属性

 <script> 标签支持   全局属性 ,并接受一些特定属性,如下所示。

属性 描述
async async 指定以异步方式执行脚本。
crossorigin anonymous
use-credentials
定义对 HTTP CORS 请求的请求模式。
defer   声明脚本不会生成任何内容。因此,浏览器/用户代理可以继续解析和呈现页面的其余部分。
nomodule true
false
S指定不应在支持 ES6 模块的浏览器中执行脚本
integrity filehash 允许浏览器检查获取的脚本,以确保在源纵时永远不会加载 coode。
referrerpolicy no-referrer
no-referrer-when-downgrade
origin
origin-when-cross-origin
same-origin
strict-origin
strict-origin-when-cross-origin
unsafe-url
指定在获取脚本时要发送的引用者信息
src   指定外部脚本的 URI/URL 路径。
type   将脚本语言指定为内容类型(MIME 类型)。

 <script> 标签示例

下面的示例将说明 <script> 标签的用法。在何处、何时以及如何使用 <script> 标签。

内部 JavaScript 使用  <script> 标签

让我们看一下有关 <script> 标签用法的基本示例。这里我们通过 <script> 标签在内部使用了javascript代码。


<!DOCTYPE html>
<html>
<head>
	 <title>HTML script Tag</title>
</head>
	 <body style="background-color:#EAFAF1 ">
	 <script type = "text/JavaScript">
			document.write("You're visiting QikepuCom!")
	 </script>
</body>
</html>

使用 <script> 标签的外部 JavaScript

考虑另一种情况,我们将在 <body> 标签之外提及 <script> 标签。


<!DOCTYPE html>
<html>
<head>
	 <script src="index.js" type="text/script"></script>
</head>
	 <body>
	 <h1>QikepuCom</h1>
</body>
</html>
index.js:

document.write("You're visiting QikepuCom!")

使用多个 <script> 标签

以下示例,我们将为每个 JavaScript 代码使用多个 <script> 标签。此代码将生成一个输出,使脚本标记触发,显示警报两次,并在网页上显示文本。


<!DOCTYPE html>
<html>
<head>
	 <script>
			alert('WELCOME TO')
	 </script>
</head>
<body>
	 <h2>The Best E-Way Learning.!</h2>
	 <script>
			alert('QikepuCom')
	 </script>
</body>
</html>

支持的浏览器

浏览器 Chrome Edge Firefox Safari Opera
是否支持 Yes Yes Yes Yes Yes