我们可以创建外部 JavaScript 文件,并在多个 HTML 页面中引用它。

这样做可以提供代码的可重用性,因为单个 JavaScript 文件可以在多个 HTML 页面中使用。

外部 JavaScript 文件必须以 .js 扩展名保存。建议将所有 JavaScript 文件嵌入到单个文件中,这样可以提高网页的加载速度。

让我们创建一个外部 JavaScript 文件,在警示对话框中打印 "Hello Javatpoint"。

message.js

function msg(){ 
  alert("Hello Javatpoint"); 
}

让我们将 JavaScript 文件包含到 HTML 页面中。这将在按钮点击时调用 JavaScript 函数。

index.html

<html>
<head>
  <script type="text/javascript" src="message.js"></script>
</head>
<body>
  <p>Welcome to JavaScript</p>
  <form>
    <input type="button" value="click" onclick="msg()"/>
  </form>
</body>
</html>

外部 JavaScript 的优势

如果用户创建了外部 JavaScript 文件,将会获得以下优势:

  1. 它有助于在多个 HTML 文件中实现代码的重用性。
  2. 它使代码易于阅读。
  3. 它是高效的,因为网页浏览器会缓存外部 js 文件,从而减少页面加载时间。
  4. 它使网页设计师和编码人员可以并行且独立地处理 html 和 js 文件,即在不面临任何代码冲突的情况下进行工作。
  5. 代码长度减少,只需要指定 js 文件的位置。

外部 JavaScript 的缺点

外部文件也有以下缺点:

  1. 攻击者可能通过 js 文件的 URL 下载程序员的代码。
  2. 如果两个 js 文件相互依赖,则一个文件的失败可能会影响到其他依赖文件的执行。
  3. 网页浏览器需要进行额外的 HTTP 请求以获取 js 代码。
  4. js 代码中的微小或大幅更改可能会导致所有依赖文件产生意外的结果。
  5. 我们需要检查每个依赖于常见外部 JavaScript 文件的文件。
  6. 如果代码只有几行,最好实现为内部 JavaScript 代码。

标签: js, JavaScript, JavaScript语言, JavaScript开发, JavaScript语法, JavaScript脚本, JavaScript教程, JavaScript入门, JavaScript入门教程, JavaScript进阶, JavaScript宝典, JavaScript学习, JavaScript指南, JavaScript大全