使用jQuery显示黑白相间的九宫格

jQuery可以配合CSS和HTML来创建一个简单的黑白相间的九宫格布局。首先，你需要准备HTML结构，通常是一个包含3行3列的小方格容器：

<div class="grid-container">
  <div class="cell black"></div>
  <!-- 重复其他8个单元格 -->
</div>

然后在CSS部分定义网格样式、颜色和大小：

.grid-container {
  display: flex;
  flex-wrap: wrap; /* 使得元素换行 */
}

.cell {
  width: calc(33.33% - 2px); /* 保证间距，假设每个小格宽度占容器的1/3 */
  height: auto;
  margin: 2px; /* 添加间隔 */
}

.black, .white {
  background-color: #000, #fff; /* 黑色和白色背景 */
}

最后，在JavaScript或jQuery中，你可以通过切换`.black`和`.white`类来改变每个小格的颜色：

// 或者 jQuery
$('.grid-container').on('click', '.cell', function() {
  $(this).toggleClass('black white');
});

当点击任何一个单元格时，它会切换为黑色或白色。如果你需要初始状态为黑白交替，只需在HTML里给第一个单元格添加适当的类。