html如何调用js的函数

在HTML中，通过`标签引入JavaScript文件或内联脚本，然后在需要的地方调用js函数。function myFunction() {...}`。

在HTML中调用JavaScript函数，可以通过以下几种方式：

html如何调用js的函数

1、内联事件处理器：在HTML元素上直接使用onclick、onload等事件属性来调用JavaScript函数。

<button onclick="myFunction()">点击我</button>

2、通过<script>标签插入JavaScript代码：在HTML文档的<head>或<body>部分使用<script>标签插入JavaScript代码，然后在需要的地方调用函数。

<!DOCTYPE html>
<html>
<head>
  <script>
    function myFunction() {
      alert("Hello, World!");
    }
  </script>
</head>
<body>
  <button onclick="myFunction()">点击我</button>
</body>
</html>

3、通过<script>标签引入外部JavaScript文件：将JavaScript代码放在单独的文件中，然后在HTML文档中使用<script>标签引入该文件，创建一个名为script.js的文件，其中包含以下内容：

function myFunction() {
  alert("Hello, World!");
}

然后在HTML文档中引入该文件：

<!DOCTYPE html>
<html>
<head>
  <script src="script.js"></script>
</head>
<body>
  <button onclick="myFunction()">点击我</button>
</body>
</html>

4、使用DOM操作调用JavaScript函数：通过JavaScript代码获取HTML元素，然后调用其方法。

<!DOCTYPE html>
<html>
<head>
  <script>
    function myFunction() {
      var btn = document.getElementById("myButton");
      btn.innerHTML = "已点击";
    }
  </script>
</head>
<body>
  <button id="myButton" onclick="myFunction()">点击我</button>
</body>
</html>