在构建H5页面时，引入JavaScript（JS）文件是常见的操作，它可以帮助我们实现页面的动态效果和交互功能。下面，我将详细讲解如何在H5页面中引入JS文件，包括在同一目录下引入和在非同一目录下引入的方法。
同一目录下引入JS文件
当JS文件和H5页面位于同一目录时，引入过程非常简单。你只需要在H5页面的<head>或<body>部分添加一个<script>标签，并设置其src属性为JS文件的名称即可。
示例代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>示例页面</title>
<script src="example.js"></script>
</head>
<body>
<!-- 页面内容 -->
</body>
</html>
在这个例子中，example.js是位于同一目录下的JS文件。
非同一目录下引入JS文件
当JS文件和H5页面不在同一目录时，你需要使用相对路径或绝对路径来指定JS文件的位置。
相对路径
相对路径是指相对于当前页面路径的路径。例如，如果你有一个名为script的子目录，其中包含example.js文件，那么你可以这样引入：
<script src="script/example.js"></script>
这里，script/example.js表示从当前页面开始，进入script目录，然后找到example.js文件。
绝对路径
绝对路径是指从网站根目录开始的完整路径。例如：
<script src="/assets/js/example.js"></script>
在这个例子中，/assets/js/example.js表示从网站根目录开始，进入assets目录，然后进入js目录，最后找到example.js文件。
注意事项
- 使用相对路径时，路径中的斜杠
/表示从根目录开始计算。 - 使用绝对路径时，路径中的第一个斜杠
/表示从根目录开始计算。 - 确保路径正确无误，否则浏览器将无法找到JS文件。
总结
通过以上方法，你可以在H5页面中成功引入JS文件。无论是同一目录还是非同一目录，只要路径正确，浏览器都能够正确加载并执行JS文件中的代码。希望这篇文章能够帮助你更好地理解H5页面中引入JS文件的方法。