Créez les 3 fichiers suivants:

morpion.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"> 
		<title>morpion</title>
		<link type="text/css" rel="stylesheet" href="morpion.css"/>
		<script src="morpion.js"></script>
	</head>
	<body>
<!--------------------->
<table id="morpion">
	<tr><td></td><td></td><td></td></tr>
	<tr><td></td><td></td><td></td></tr>
	<tr><td></td><td></td><td></td></tr>
</table>
<!--------------------->
	</body>
</html>

morpion.css

#morpion 
{
	border-collapse: collapse;
}

#morpion td
{
	border: 1px solid black;
	width: 40px;
	height: 40px;
	font-size: 30px;
	text-align: center;
	cursor: pointer;
}

#morpion td:hover
{
	background-color: #ffc;
}

morpion.js

console.log("Ce programme JS vient d'être chargé");

document.addEventListener("DOMContentLoaded", function() 
{ 
	console.log("Le document est pret");
	var joueur="X";

});