在HTML5中，编写函数主要涉及到JavaScript的使用，JavaScript是一种广泛用于网页开发的脚本语言，它允许开发者在网页中实现动态效果和交互功能，本文将详细介绍如何在HTML5中编写JavaScript函数，并通过实例进行演示。
我们需要了解什么是函数，函数是一段可重复使用的代码，它接受输入参数并返回一个结果，在JavaScript中，函数可以通过关键字function来定义。
以下是一个简单的JavaScript函数示例：
function add(a, b) {
return a + b;
}
这个函数名为add，接受两个参数a和b，然后返回它们的和，要在HTML5中使用这个函数，我们需要在<script>标签内编写JavaScript代码，并将该标签放置在HTML文档的<head>或<body>部分。
下面是一个完整的HTML5文档示例，展示了如何在其中编写和使用JavaScript函数：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript Function Example</title>
<script>
// 定义一个函数
function add(a, b) {
return a + b;
}
// 定义另一个函数
function multiply(a, b) {
return a * b;
}
</script>
</head>
<body>
<h1>JavaScript Function Example</h1>
<p>Result of addition: <span id="addResult">0</span></p>
<p>Result of multiplication: <span id="multiplyResult">0</span></p>
<script>
// 使用函数计算结果并显示在页面上
document.getElementById("addResult").innerHTML = add(5, 3);
document.getElementById("multiplyResult").innerHTML = multiply(5, 3);
</script>
</body>
</html>
在这个示例中，我们定义了两个函数：add和multiply，这两个函数分别用于计算两个数的和与积，我们在HTML文档的<body>部分添加了两个<p>元素，用于显示计算结果，通过在<script>标签内编写JavaScript代码，我们可以使用这些函数计算结果，并将结果显示在页面上。
我们还可以使用箭头函数（Arrow Functions）来简化函数的书写，箭头函数是ES6（ECMAScript 2015）引入的一种新的函数语法，它使代码更简洁易读，下面是一个使用箭头函数的示例：
// 使用箭头函数定义一个函数 const subtract = (a, b) => a - b; // 使用箭头函数定义另一个函数 const divide = (a, b) => a / b;
在HTML5中编写JavaScript函数是一种实现网页动态效果和交互功能的重要方法，通过在<script>标签内定义函数，并在HTML文档中调用这些函数，我们可以实现各种复杂的网页应用。