我一直在尝试将我的three.js函数与HTML关联起来，以便当鼠标点击元素时，在外部js文件中运行该js函数。我以为我已经正确地完成了所有步骤，但仍然无法正常工作。
我已经尝试修改库和外部文件的目录，并移动script标签以查看是否有所改变，但这种本应能正常工作的操作却未能成功，所以我已经用尽了解决方案。
我已经将js文件放在了同一个文件夹中，并且我确定函数名称是正确的。
<!DOCTYPE html>
<html>
<head>
<title>太阳系</title>
<style>
body {
margin: 0;
}
canvas {
width: 100%;
height: 100%
}
</style>
</head>
<body>
<script type="module" src="./index.js"></script>
<link href="./styles.css" rel="stylesheet" />
<script src="./js/threex.domevents.js"></script>
<script src="./js/three.module.js"></script>
<script src="./js/threex.linkify.js"></script>
<div id="planet-menu">
<ul>
<li onclick="selectPlanet('Mercury')">水星</li>
<li onclick="selectPlanet('Venus')">金星</li>
<li onclick="selectPlanet('Earth')">地球</li>
<li onclick="selectPlanet('Mars')">火星</li>
<li onclick="selectPlanet('Jupiter')">木星</li>
<li onclick="selectPlanet('Saturn')">土星</li>
<li onclick="selectPlanet('Uranus')">天王星</li>
<li onclick="selectPlanet('Neptune')">海王星</li>
</ul>
</div>
<!-- 注意：这里你已经引入了一次index.js，不需要再次引入 -->
<!-- <script type="module" src="./index.js "></script> -->
</body>
</html>