如何在 HTML 中调用 JavaScript 函数？

在 HTML 文档中有多种调用 JavaScript 函数的方法，这也不是一项困难的任务。首先，我们使用了一种最简单的方法在 HTML 文档中调用 JavaScript 函数。

在此方法中，我们将在 HTML 文档的 head 部分创建和定义一个函数。要在 html 文档中调用此函数，我们需要创建一个简单的按钮，并使用 onclick 事件属性（这是一个事件处理器）来通过单击按钮来调用函数。

为了更清楚地理解这一点，让我们看一个示例程序。

程序

程序说明

在上面的程序中，我们创建了一个简单的 HTML 文档。在 HTML 文档的 head 部分，我们在 script 标签 <script>...</script> 中定义了一个函数（例如 myfunction();)。

另一方面，在 body 部分，我们显示了一些文本并创建了一个按钮。为了调用我们的函数，我们使用了按钮旁边的 onclick 属性，当用户单击该按钮时，我们的函数就会执行并显示一个警报消息，正如您在输出中看到的。

输出

使用外部 JavaScript 文件调用函数

我们还可以使用附加到 HTML 文档的外部 JavaScript 文件来调用 JavaScript 函数。为此，我们首先需要创建一个 JavaScript 文件，并在其中定义我们的函数，然后将其保存为 (.Js) 扩展名。

创建 JavaScript 文件后，我们需要创建一个简单的 HTML 文档。要将我们的 JavaScript 文件包含在 HTML 文档中，我们需要使用 script 标签 <script type = "text/javascript" src = "function.js">，并在 "src" 属性中提供 JavaScript 文件的存储路径。在将外部 JavaScript 文件链接到 HTML 文档后，我们可以创建一个按钮并使用带有按钮的 "onclick" 属性来调用 函数。

让我们通过一个示例程序来理解。

程序

程序说明

在上面的程序中，我们首先创建了一个 JavaScript 文件，并在其中定义了我们的函数，然后将其保存为 .js 扩展名。

Function.js

创建 JavaScript 文件后，我们创建了一个 HTML 文档，并使用 <script type = "text/javascript" src="function.js"></script> 链接了我们的 JavaScript 文件。因为我们将 HTML 文档和 JavaScript 文件存储在同一个文件夹中，所以在 "scr" 属性中只写了 JavaScript 文件名，而不是在 head 部分提供完整路径。

在 body 部分，我们显示了一些文本并创建了一个按钮。为了调用我们的函数，我们使用了按钮旁边的 onclick 属性，当用户单击该按钮时，我们的函数就会执行并显示一个警报消息，正如您在输出中看到的。

输出

现在单击给定的按钮。