在HTML中加入JavaScript，可以通过以下几种方式：
1、内嵌式（Inline）：将JavaScript代码直接写在HTML标签内部，这种方法适用于简单的脚本，但不利于代码的维护和复用。
<!DOCTYPE html>
<html>
<head>
<title>内嵌式JavaScript示例</title>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<button onclick="alert('你好，世界！')">点击我</button>
</body>
</html>
2、外部引用（External）：将JavaScript代码保存在一个单独的文件中，然后在HTML文件中使用<script>标签引用该文件，这种方法有利于代码的模块化和复用。
创建一个名为script.js的文件，并将以下JavaScript代码保存在其中：
function showMessage() {
alert('你好，世界！');
}
在HTML文件中引用script.js文件：
<!DOCTYPE html>
<html>
<head>
<title>外部引用JavaScript示例</title>
<script src="script.js"></script>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<button onclick="showMessage()">点击我</button>
</body>
</html>
3、事件监听器（Event Listener）：通过为HTML元素添加事件监听器，可以在特定事件发生时执行JavaScript代码，这种方法适用于动态生成的元素或用户交互。
<!DOCTYPE html>
<html>
<head>
<title>事件监听器示例</title>
<script>
function showMessage() {
alert('你好，世界！');
}
</script>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<button id="myButton">点击我</button>
<script>
document.getElementById('myButton').addEventListener('click', showMessage);
</script>
</body>
</html>
4、DOM操作：通过JavaScript操作HTML文档的结构和内容，这种方法适用于需要动态更新页面的场景。
<!DOCTYPE html>
<html>
<head>
<title>DOM操作示例</title>
<script>
function addElement() {
var newElement = document.createElement('p');
newElement.innerHTML = '这是一个新的段落。';
document.body.appendChild(newElement);
}
</script>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<button onclick="addElement()">添加段落</button>
</body>
</html>
5、AJAX：通过JavaScript发送异步请求，从服务器获取数据并更新页面内容，这种方法适用于需要与服务器进行数据交互的场景。
<!DOCTYPE html>
<html>
<head>
<title>AJAX示例</title>
<script>
function loadData() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xhttp.open("GET", "data.txt", true);
xhttp.send();
}
</script>
</head>
<body>
<h1>欢迎来到我的网站！</h1>
<button onclick="loadData()">加载数据</button>
<div id="demo"></div>
</body>
</html>
以上就是在HTML中加入JavaScript的五种方法，根据实际需求选择合适的方法，可以更好地实现网页的功能和交互。