消灭星星键盘和鼠标控制选择星星并消除的代码

消灭星星是一种流行的小游戏，你可以使用键盘和鼠标来控制选择星星并消除。以下是一个简单的 JavaScript 代码示例，可以实现这个游戏的功能：

HTML 代码：

<div id="game-board">
  <!-- 显示星星的棋盘 -->
</div>

JavaScript 代码：

var board = new Array(10);
for (var i = 0; i < 10; i++) {
  board[i] = new Array(10);
}

// 在棋盘上随机生成星星
function generateBoard() {
  for (var i = 0; i < 10; i++) {
    for (var j = 0; j < 10; j++) {
      board[i][j] = Math.floor(Math.random() * 5) + 1;
    }
  }
}

// 显示棋盘上的星星
function displayBoard() {
  var boardDiv = document.getElementById("game-board");
  boardDiv.innerHTML = "";
  for (var i = 0; i < 10; i++) {
    for (var j = 0; j < 10; j++) {
      var starDiv = document.createElement("div");
      starDiv.className = "star";
      starDiv.style.backgroundImage = "url(star" + board[i][j] + ".png)";
      starDiv.setAttribute("data-row", i);
      starDiv.setAttribute("data-col", j);
      starDiv.onclick = handleClick;
      boardDiv.appendChild(starDiv);
    }
  }
}

// 处理点击事件
function handleClick(event) {
  var starDiv = event.target;
  var row = parseInt(starDiv.getAttribute("data-row"));
  var col = parseInt(starDiv.getAttribute("data-col"));
  var color = board[row][col];
  
  // 找出相邻的同色星星
  var starsToRemove = findAdjacentStars(row, col, color, []);
  
  // 如果找到了相邻的星星，就消除它们
  if (starsToRemove.length >= 3) {
    removeStars(starsToRemove);
  }
}

// 找出相邻的同色星星
function findAdjacentStars(row, col, color, starsToRemove) {
  if (row < 0 || row >= 10 || col < 0 || col >= 10) {
    return starsToRemove;
  }
  if (board[row][col] != color) {
    return starsToRemove;
  }
  if (starsToRemove.indexOf(row + "," + col) >= 0) {
    return starsToRemove;
  }
  starsToRemove.push(row + "," + col);
  findAdjacentStars(row - 1, col, color, starsToRemove);
  findAdjacentStars(row + 1, col, color, starsToRemove);
  findAdjacentStars(row, col - 1, color, starsToRemove);
  findAdjacentStars(row, col + 1, color, starsToRemove);
  return starsToRemove;
}

// 消除星星
function removeStars(starsToRemove) {
  for (var i = 0; i < starsToRemove.length; i++) {
    var starPos = starsToRemove[i].split(",");
    var row = parseInt(starPos[0]);
    var col = parseInt(starPos[1]);
    board[row][col] = 0;
  }
  displayBoard();
}

// 初始化游戏
function initGame() {
  generateBoard();
  displayBoard();
}

initGame();

在以上代码中，`generateBoard` 函数会在棋盘上随机生成星星，`displayBoard` 函数会显示棋盘上的星星。当玩家点击一个星星时，`handleClick` 函数会找出相邻的同色星星，并将它们消除。

你可以在 CSS 文件中添加以下代码来定义星星的样式：

.star {
  width: 50px;
  height: 50px;
  background-size: cover;
  display: inline-block;
  margin: 0;
  padding: 0;
}

#game-board {
  width: 500px;
  height: 500px;
  border: 1px solid black;
}

你还需要准备五张星星图片，分别命名为 `star1.png` 到 `star5.png`，放在与 HTML 文件相同的目录下。

这样，你就可以在浏览器中运行这个游戏了。