<html>
<head>
<title>JavaScriptとHTMLの連携</title>
<script>
// JavaScriptコードをここに記述する
function myFunction() {
// 何らかの処理を行う
}
</script>
</head>
<body>
<!-- HTMLコンテンツ -->
<button onclick="myFunction()">ボタン</button>
</body>
</html>上記の例では、<script> タグ内にJavaScriptコードを記述し、ボタンをクリックした際に myFunction() 関数が実行されるようになっています。
外部のJavaScriptファイルを読み込む方法: JavaScriptコードを外部のファイルに記述し、HTMLファイルから読み込むこともできます。以下はその例です。
<html>
<head>
<title>JavaScriptとHTMLの連携</title>
<script src="script.js"></script>
</head>
<body>
<!-- HTMLコンテンツ -->
<button onclick="myFunction()">ボタン</button>
</body>
</html>イベントリスナーを使用する方法: JavaScriptのイベントリスナーを使用して、特定のイベント（例: ボタンクリック）に対して処理を実行することもできます。以下はその例です。
<html>
<head>
<title>JavaScriptとHTMLの連携</title>
<script src="script.js"></script>
</head>
<body>
<!-- HTMLコンテンツ -->
<button id="myButton">ボタン</button>
<script>
// JavaScriptコードをここに記述する
document.getElementById('myButton').addEventListener('click', myFunction);
</script>
</body>
</html>上記の例では、<button> 要素に対して id 属性を追加し、JavaScriptコード内で addEventListener() メソッドを使用してボタンクリックイベントに対する処理を登録しています。
これらはJavaScriptとHTMLの連携方法の一部です。他にもさまざまな方法がありますが、上記の方法は一般的なものです。ウェブ開発やフロントエンド開発においては、これらの方法を組み合わせて使用することが一般的です。