当前位置： 首页 > news >正文

前端技术搭建五子棋游戏（内含源码）

news 2025/11/27 8:48:18

The sand accumulates to form a pagoda

  • ✨ 写在前面
  • ✨ 功能介绍
  • ✨ 页面搭建
  • ✨ 样式设置
  • ✨ 逻辑部分

✨ 写在前面

上周我们实通过前端基础实现了拼图游戏，今天还是继续按照我们原定的节奏来带领大家完成一个五子棋游戏，功能也比较简单简单，也是想借助这样一个简单的功能，然后来帮助大家了解我们JavaScript在前端中的作用， 在前面的文章当中我们也提及到我们在本系列的专栏是循序渐进从简单到复杂的过程，这份专栏中我们会带领大家用前端实现翻卡片、飞机大战、弹珠游戏、贪吃蛇、井字游戏、拼图、连连看、扫雷等等有趣的小游戏，纯前端语言实现，都会陆续带给大家。欢迎大家订阅我们这份前端小游戏的专栏。订阅链接：https://blog.csdn.net/jhxl_/category_12261013.html

✨ 功能介绍

五子棋是一种古老而受欢迎的策略棋类游戏，它的目标是在棋盘上先形成连续的五个棋子（横向、纵向或对角线），以赢得比赛。这款游戏简单易学，同时也有很高的策略性和竞争性，因此深受广大玩家喜爱。

游戏棋盘：五子棋的棋盘是一个15x15的方格网格，共有225个交叉点。玩家可以在这些交叉点上放置自己的棋子。

游戏目标：玩家需要先于对手在棋盘上形成连续的五个棋子（横向、纵向或对角线），以获得胜利。

在这里插入图片描述

游戏流程：玩家与电脑（或其他玩家）轮流进行下棋，玩家先手。玩家可以通过点击棋盘上的交叉点来放置自己的棋子。电脑（或其他玩家）也会在空闲的交叉点上进行自己的下棋操作。每一步棋之后，都会检查是否有玩家获胜或者游戏结束。

获胜条件：如果玩家在横向、纵向或对角线上形成连续的五个棋子（即五子连珠），即可获得胜利。如果棋盘填满且没有玩家获胜，则宣布游戏为平局。

再来一局：在游戏结束后，玩家可以选择重新开始一局，棋盘会被清空，双方重新开始对决。

通过上述规则，你可以实现一个简单的玩家对电脑的五子棋游戏。你可以根据自己的喜好和需求进一步扩展和定制游戏功能，例如添加游戏设置、优化电脑的下棋策略等。祝你玩得愉快！

✨ 页面搭建

创建文件

首先呢我们创建我们的HTML文件，这里我就直接命名为 五子棋.html 了，大家可以随意命名， 文件创建生成后我们通过编辑器打开，这里我用的是VScode， 然后初始化我们的代码结构，那在这里告诉大家一个快捷键，就是我们敲上我们英文的一个 ! 我们敲击回车直接就会给我们生成基础版本的前端代码结构。

在这里插入图片描述

文档声明和编码设置： 在HTML文档的头部，使用<!DOCTYPE>声明HTML文档类型，确保浏览器以正确的方式渲染网页内容。同时，设置UTF-8编码，以确保浏览器能够正确地解析和显示中文字符。下面我就开始搭建我们的DOM结构了！

DOM结构搭建

<body><div class="board"></div><div class="message"></div><button class="reset-button">重新开始</button>
</body>
  • <body>：页面的主体元素。
  • <div class="board">：一个具有board类的<div>元素，用于承载五子棋的棋盘。
  • <div class="message">：一个具有message类的<div>元素，用于显示游戏中的消息或提示。
  • <button class="reset-button">重新开始</button>：一个具有reset-button类的<button>元素，用于重新开始游戏。

这段代码描述了一个五子棋游戏的基本页面结构，其中棋盘、消息和重新开始按钮是游戏的主要组成部分。

✨ 样式设置

我们看到了上面的的DOM已经搭建好了，但是页面什么都看不出来，下面我们简单的来配置一下样式吧，其实我们本专栏也是想带领大家掌握一些逻辑所以样式方面我们就一切从简；

  • .board：棋盘容器的样式规则，使用网格布局，设置背景颜色和间距。

  • .cell：每个棋盘格子的样式规则，设置背景颜色和边框。

  • .cell:hover：鼠标悬停在格子上时的样式规则，设置背景颜色。

  • .piece：棋子的样式规则，设置宽度、高度、边框半径和间距。

  • .black-piece：黑色棋子的样式规则，设置背景颜色。

  • .white-piece：白色棋子的样式规则，设置背景颜色。

  • .message：消息文本的样式规则，设置字体粗细。

  • .reset-button：重新开始按钮的样式规则，设置上方间距。

这些样式规则通过类名的方式应用到HTML元素上，从而实现了五子棋游戏界面的样式效果。

<style>.board {display: grid;grid-template-columns: repeat(15, 40px);grid-template-rows: repeat(15, 40px);gap: 1px;background-color: #aaa;margin-bottom: 20px;}.cell {background-color: #eee;border: 1px solid #ccc;}.cell:hover {background-color: #ddd;}.piece {width: 36px;height: 36px;border-radius: 50%;margin: 2px;}.black-piece {background-color: #000;}.white-piece {background-color: #fff;}.message {font-weight: bold;}.reset-button {margin-top: 10px;}
</style>

在这里插入图片描述

✨ 逻辑部分

上面我们搭建了基本的样式，下面呢我们就通过js代码，实现我们游戏的功能吧，下面是对代码的简化解释：

  • createBoard()：创建棋盘函数，用于动态生成一个15x15的棋盘，并为每个格子添加事件监听器。

  • handleCellClick(event)：处理格子点击事件函数，根据当前游戏状态和点击的格子位置判断是否可以下子，并进行相应的处理。

  • placePiece(row, col, player)：下子函数，根据给定的行、列和玩家类型，在指定的格子位置放置对应颜色的棋子，并更新棋盘状态。

  • switchPlayer()：切换玩家函数，用于在玩家下子后切换到另一个玩家。

  • checkWin(row, col)：检查胜利函数，根据当前下子的位置检查是否达到五子连珠的胜利条件。

  • checkDirection(row, col, dx, dy, player)：检查方向函数，根据指定的方向，在当前位置的左右两侧检查是否有连续的同色棋子。

  • isValidPosition(row, col)：验证位置有效性函数，用于判断指定的行和列是否在合法的范围内。

  • makeComputerMove()：电脑下子函数，随机生成电脑下子的位置，并执行下子操作。

  • endGame(winner)：结束游戏函数，当游戏达到胜利条件时，设置游戏结束标志，并显示胜利信息。

  • resetGame()：重新开始游戏函数，用于重置游戏状态，清空棋盘，重新创建棋盘。

  • resetButton.addEventListener('click', resetGame)：绑定重新开始按钮的点击事件监听器。

  • createBoard()：在页面加载完成后，执行创建棋盘的函数，初始化游戏。

以上是对给定的JavaScript代码中各个方法的大概作用进行的简要讲解。每个方法都承担着不同的功能，通过它们的协作实现了一个基本的人机对决的五子棋游戏。

完整代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>几何⚡️前端小游戏⚡️五子棋</title><style>.board {display: grid;grid-template-columns: repeat(15, 40px);grid-template-rows: repeat(15, 40px);gap: 1px;background-color: #aaa;margin-bottom: 20px;}.cell {background-color: #eee;border: 1px solid #ccc;}.cell:hover {background-color: #ddd;}.piece {width: 36px;height: 36px;border-radius: 50%;margin: 2px;}.black-piece {background-color: #000;}.white-piece {background-color: #fff;}.message {font-weight: bold;}.reset-button {margin-top: 10px;}</style>
</head><body><div class="board"></div><div class="message"></div><button class="reset-button">重新开始</button>
</body><script>document.addEventListener('DOMContentLoaded', () => {const board = document.querySelector('.board');const message = document.querySelector('.message');const resetButton = document.querySelector('.reset-button');const PlayerType = {PLAYER: 'player',COMPUTER: 'computer',};let currentPlayer = PlayerType.PLAYER;let isGameOver = false;let boardState = [];function createBoard() {board.innerHTML = '';for (let row = 0; row < 15; row++) {boardState[row] = [];for (let col = 0; col < 15; col++) {const cell = document.createElement('div');cell.classList.add('cell');cell.dataset.row = row;cell.dataset.col = col;cell.addEventListener('click', handleCellClick);board.appendChild(cell);boardState[row][col] = '';}}}function handleCellClick(event) {if (isGameOver) {return;}const cell = event.target;const row = parseInt(cell.dataset.row);const col = parseInt(cell.dataset.col);if (boardState[row][col] !== '') {return;}placePiece(row, col, currentPlayer);if (checkWin(row, col)) {endGame(currentPlayer);return;}switchPlayer();if (currentPlayer === PlayerType.COMPUTER && !isGameOver) {makeComputerMove();}}function placePiece(row, col, player) {const piece = document.createElement('div');piece.classList.add('piece');piece.classList.add(player === PlayerType.PLAYER ? 'black-piece' : 'white-piece');const cell = document.querySelector(`.cell[data-row="${row}"][data-col="${col}"]`);cell.appendChild(piece);boardState[row][col] = player;}function switchPlayer() {currentPlayer = currentPlayer === PlayerType.PLAYER ? PlayerType.COMPUTER : PlayerType.PLAYER;}function checkWin(row, col) {const directions = [[1, 0],[0, 1],[1, 1],[1, -1]];const player = boardState[row][col];for (const direction of directions) {const [dx, dy] = direction;let count = 1;// Check for consecutive pieces in both directionscount += checkDirection(row, col, dx, dy, player);count += checkDirection(row, col, -dx, -dy, player);if (count >= 5) {return true;}}return false;}function checkDirection(row, col, dx, dy, player) {let count = 0;let newRow = row + dx;let newCol = col + dy;while (isValidPosition(newRow, newCol) && boardState[newRow][newCol] === player) {count++;newRow += dx;newCol += dy;}return count;}function isValidPosition(row, col) {return row >= 0 && row < 15 && col >= 0 && col < 15;}function makeComputerMove() {// Generate a random move for the computerlet row, col;do {row = Math.floor(Math.random() * 15);col = Math.floor(Math.random() * 15);} while (boardState[row][col] !== '');placePiece(row, col, currentPlayer);if (checkWin(row, col)) {endGame(currentPlayer);return;}switchPlayer();}function endGame(winner) {isGameOver = true;message.textContent = winner === PlayerType.PLAYER ? 'You win!' : 'Computer wins!';}function resetGame() {currentPlayer = PlayerType.PLAYER;isGameOver = false;boardState = [];message.textContent = '';createBoard();}resetButton.addEventListener('click', resetGame);createBoard();});
</script></html>

几何送书七十二期

参与方式：本博客中进行评论即可，只要评论内容不被折叠都可以参与抽奖；
抽奖方式：程序自动拉取未折叠的评论随机抽取5位伙伴，每人最多可评论5次；
抽奖时间：2023-07-07 17:00
本期获奖者各送实体书《Python从入门到精通》一本（包邮到家）

在这里插入图片描述

在这里插入图片描述

✨ 原创不易，还希望各位大佬支持一下 \textcolor{blue}{原创不易，还希望各位大佬支持一下} 原创不易，还希望各位大佬支持一下

👍 点赞，你的认可是我创作的动力！ \textcolor{green}{点赞，你的认可是我创作的动力！} 点赞，你的认可是我创作的动力！

⭐️ 收藏，你的青睐是我努力的方向！ \textcolor{green}{收藏，你的青睐是我努力的方向！} 收藏，你的青睐是我努力的方向！

✏️ 评论，你的意见是我进步的财富！ \textcolor{green}{评论，你的意见是我进步的财富！} 评论，你的意见是我进步的财富！

相关文章：

前端技术搭建五子棋游戏（内含源码）

The sand accumulates to form a pagoda ✨ 写在前面✨ 功能介绍✨ 页面搭建✨ 样式设置✨ 逻辑部分 ✨ 写在前面 上周我们实通过前端基础实现了拼图游戏&#xff0c;今天还是继续按照我们原定的节奏来带领大家完成一个五子棋游戏&#xff0c;功能也比较简单简单&#xff0c;也…...

编程日记 2023/8/12 1:11:02

AST入门与实战(三):if节点转switch节点(瑞数5)

原文地址:https://zhuoyue360.com/jsnx/110.html 1. 期望 这是一个瑞数5代解混淆的案例&#xff0c;我们本章节需要做的是把if节点的内容转换成switch-case内容.以此来熟悉AST对JS混淆的对抗. 原始代码: function whileState() {while (1) {aV cA[wU];if (aV < 4) {if (…...

编程日记 2023/8/12 1:10:01

小白到运维工程师自学之路 第七十一集 （kubernetes网络设置）

一、概述 Master 节点NotReady 的原因就是因为没有使用任何的网络插件&#xff0c;此时Node 和Master的连接还不正常。目前最流行的Kubernetes 网络插件有Flannel、Calico、Canal、Weave 这里选择使用flannel。 二、安装flannel 1、master下载kube-flannel.yml&#xff0c;所…...

编程日记 2023/8/12 1:09:00

day17 enum abstract interface 枚举 抽象 接口

一、枚举 enum 枚举本来的面目 创建Season类&#xff0c; 所有类都默认继承Object&#xff0c;写不写都一样 声明属性 &#xff1a;季节的名字、 季节的描述&#xff0c; 因为枚举的对象是看的见的客观事物&#xff0c; 想让它的属性不可修改 使用 final修饰表示最终的 &am…...

编程日记 2023/8/12 1:07:58

c刷题（二）

目录 加减混合运算 计算n的k次方 计算非负整数各位之和 字符串逆序 双指针 递归 矩阵计算 矩阵转置 加减混合运算 题目&#xff1a;计算1 / 1 - 1 / 2 1 / 3 - 1 / 4 1 / 5 …… 1 / 99 - 1 / 100 的值&#xff0c;打印出结果。 一般情况我们可以写个循环然后在用条…...

编程日记 2023/8/12 1:06:55

【leetcode】15. 三数之和(medium)

给你一个整数数组 nums &#xff0c;判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k &#xff0c;同时还满足 nums[i] nums[j] nums[k] 0 。请 你返回所有和为 0 且不重复的三元组。 注意&#xff1a;答案中不可以包含重复的三元组。 这题真…...

编程日记 2023/8/12 1:05:53

【css】属性选择器

有些场景中需要在相同元素中获取具有特定属性的元素&#xff0c;比如同为input&#xff0c;type属性有text、button&#xff0c;可以通过属性选择器设置text和button的不同样式。 代码&#xff1a; <style> input[typetext] {width: 150px;display: block;margin-bottom…...

编程日记 2023/8/12 1:04:53

Redis_概述

1.redis概述 1.1 简介 截止到2021年12月 数据库排名https://db-engines.com/en/ranking redis(Remote Dictionary Server) 一个开源的key-value存储系统它支持存储的Value类型&#xff1a;包括String(字符串),list(链表),set(集合),zset(sorted set 有序集合),hash(哈希类型…...

编程日记 2023/8/12 1:03:49

【从零学习python 】16. Python字符串的format方法(一)

文章目录 字符串的format方法1. 概念:2. 字段名2.1 简单字段名2.1.1 省略字段名2.1.2 数字字段名2.1.3 变量字段名2.1.4 简单字段名的混合使用2.1.5 使用元组和字典传参 进阶案例 字符串的format方法 1. 概念: str.format() 方法通过字符串中的大括号{}来识别替换字段 replac…...

编程日记 2023/8/12 1:02:48

python re 模块 正则表达式

一、正则表达式基本符号 ^ 表示匹配字符串的开始位置 (例外 用在中括号中[ ] 时,可以理解为取反,表示不匹配括号中字符串)$ 表示匹配字符串的结束位置* 表示匹配 零次到多次&#xff08;记忆方法&#xff1a;符号是星星&#xff0c;天上的星星可以是无数个也可以看不到&#x…...

编程日记 2023/8/12 1:01:46

c#设计模式-创建型模式 之 单例模式

目录 前言&#xff1a; 优点&#xff1a; 缺点: 饿汉式&#xff08;静态变量方式&#xff09; 懒汉式&#xff08;线程不安全&#xff09; 懒汉式&#xff08;双重检查锁定&#xff09; 推荐方式Lazy 总结&#xff1a; 前言&#xff1a; 这种模式涉及到一个单一的类&a…...

编程日记 2023/8/12 1:00:45

K-01BFS（2023河南萌新联赛第（五）场：郑州轻工业大学）

链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 来源&#xff1a;牛客网 思路&#xff1a; 直接枚举这个图中的拐点 这个拐点是经过左右平移到上下平移或者上下平移到左右平移 假设这个点事左到右后然后再从下到上 左到右就相当于走了个最长上升子序列&#xff0…...

编程日记 2023/8/12 0:59:44

CSP复习每日一题（四）

树的重心 给定一颗树&#xff0c;树中包含 n n n 个结点&#xff08;编号 1 ∼ n 1∼n 1∼n&#xff09;和 n − 1 n−1 n−1条无向边。请你找到树的重心&#xff0c;并输出将重心删除后&#xff0c;剩余各个连通块中点数的最大值。 重心定义&#xff1a; 重心是指树中的一…...

编程日记 2023/8/12 0:58:43

dubbo之整合SpringBoot

目录 zookeeper安装 1.拉取ZooKeeper镜像 2.新建文件夹 3.挂载本地文件夹并启动服务 4.查看容器 5.进入容器&#xff08;zookeeper&#xff09; Dubbo Admin安装 1.下载dubbo-admin 2.zip包解压 3.修改配置文件 4.打包项目 5.启动jar 6.访问 构建项目 api模块 1.创建…...

编程日记 2023/8/12 0:57:40

UE 5 GAS 在项目中处理AttributeSet相关

这一篇文章是个人的实战经验记录&#xff0c;如果对基础性的内容不了解的&#xff0c;可以看我前面一篇文章对基础的概念以及内容的讲解。 设置AttributeSet 使用GAS之前&#xff0c;首先需要设置参数集AS&#xff0c;这个是用于同步的一些参数&#xff0c;至于如何设置GAS&a…...

编程日记 2023/8/12 0:56:40

JDBC数据库连接

目录 引言 一&#xff0c;基本概念 二&#xff0c;常用操作步骤 三&#xff0c;连接操作 引言 JDBC(Java DataBase Connectivity,java数据库连接)是一种用于执行SQL语句的Java API&#xff0c;可以为多种 关系数据库提供统一访问&#xff0c;它由一组用Java语言编写的类和接口…...

编程日记 2023/8/12 0:55:39

gitee分支合并

合并dev分支到master&#xff08;合并到主分支&#xff09; git checkout master git merge dev //这里的dev表示你的分支名称 git push //推送到远程仓库 效果如下图 不报错就表示推送成功了&#xff0c;希望能帮助各位小伙伴...

编程日记 2023/8/12 0:54:37

Python小白入门：文件、异常处理和json格式存储数据

这里写自定义目录标题 所用资料 一、从文件中读取数据1.1 读取整个文件1.2 文件路径1.3 逐行读取1.4 创建一个包含文件各行内容的列表1.5 使用文件的内容1.6 包含一百万位的大型文件1.7 圆周率值中包含你的生日吗练习题 二、写入文件2.1 写入空文件2.2 写入多行2.3 附加到文件练…...

编程日记 2023/8/12 0:53:34

16bit、8 通道、500kSPS、 SAR 型 ADC——MS5188N

MS5188N 是 8 通道、 16bit 、电荷再分配逐次逼近型模数 转换器&#xff0c;采用单电源供电。 MS5188N 拥有多通道、低功耗数据采集系统所需的所有 组成部分&#xff0c;包括&#xff1a;无失码的真 16 位 SAR ADC &#xff1b;用于将输入配 置为单端输入&#xff0…...

编程日记 2023/8/12 0:52:31

Chapter 12: Regular expressions | Python for Everybody 讲义笔记_En

文章目录 Python for Everybody课程简介Regular ExpressionsRegular ExpressionsCharacter matching in regular expressionsExtracting data using regular expressionsCombining searching and extractingEscape characterSummaryBonus section for Unix / Linux usersDebugg…...

编程日记 2023/8/12 0:51:30

UE5 学习系列（二）用户操作界面及介绍

这篇博客是 UE5 学习系列博客的第二篇&#xff0c;在第一篇的基础上展开这篇内容。博客参考的 B 站视频资料和第一篇的链接如下&#xff1a; 【Note】&#xff1a;如果你已经完成安装等操作&#xff0c;可以只执行第一篇博客中 2. 新建一个空白游戏项目 章节操作&#xff0c;重…...

编程新知 2025/11/26 18:11:22

微信小程序之bind和catch

这两个呢&#xff0c;都是绑定事件用的&#xff0c;具体使用有些小区别。 官方文档&#xff1a; 事件冒泡处理不同 bind&#xff1a;绑定的事件会向上冒泡&#xff0c;即触发当前组件的事件后&#xff0c;还会继续触发父组件的相同事件。例如&#xff0c;有一个子视图绑定了b…...

编程新知 2025/11/21 20:45:17

UDP(Echoserver)

网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法&#xff1a;netstat [选项] 功能&#xff1a;查看网络状态 常用选项&#xff1a; n 拒绝显示别名&#…...

编程新知 2025/11/25 14:20:40

Neo4j 集群管理：原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档，本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石，用于构建高可用、可扩展且一致的图数据库服务…...

编程新知 2025/7/4 0:49:28

成都鼎讯硬核科技！雷达目标与干扰模拟器，以卓越性能制胜电磁频谱战

在现代战争中&#xff0c;电磁频谱已成为继陆、海、空、天之后的 “第五维战场”&#xff0c;雷达作为电磁频谱领域的关键装备&#xff0c;其干扰与抗干扰能力的较量&#xff0c;直接影响着战争的胜负走向。由成都鼎讯科技匠心打造的雷达目标与干扰模拟器&#xff0c;凭借数字射…...

编程新知 2025/11/17 21:41:48

项目部署到Linux上时遇到的错误（Redis，MySQL，无法正确连接，地址占用问题）

Redis无法正确连接 在运行jar包时出现了这样的错误 查询得知问题核心在于Redis连接失败&#xff0c;具体原因是客户端发送了密码认证请求&#xff0c;但Redis服务器未设置密码 1.为Redis设置密码&#xff08;匹配客户端配置&#xff09; 步骤&#xff1a; 1&#xff09;.修…...

编程新知 2025/11/26 7:58:37

R语言速释制剂QBD解决方案之三

本文是《Quality by Design for ANDAs: An Example for Immediate-Release Dosage Forms》第一个处方的R语言解决方案。 第一个处方研究评估原料药粒径分布、MCC/Lactose比例、崩解剂用量对制剂CQAs的影响。 第二处方研究用于理解颗粒外加硬脂酸镁和滑石粉对片剂质量和可生产…...

编程新知 2025/11/27 2:40:47

GitHub 趋势日报 (2025年06月06日)

&#x1f4ca; 由 TrendForge 系统生成 | &#x1f310; https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日获星趋势图 今日获星趋势图 590 cognee 551 onlook 399 project-based-learning 348 build-your-own-x 320 ne…...

编程新知 2025/9/7 2:12:04

【实施指南】Android客户端HTTPS双向认证实施指南

&#x1f510; 一、所需准备材料 证书文件&#xff08;6类核心文件&#xff09; 类型 格式 作用 Android端要求 CA根证书 .crt/.pem 验证服务器/客户端证书合法性 需预置到Android信任库 服务器证书 .crt 服务器身份证明 客户端需持有以验证服务器 客户端证书 .crt 客户端身份…...

编程新知 2025/9/15 14:56:23

动态规划-1035.不相交的线-力扣(LeetCode)

一、题目解析 光看题目要求和例图&#xff0c;感觉这题好麻烦&#xff0c;直线不能相交啊&#xff0c;每个数字只属于一条连线啊等等&#xff0c;但我们结合题目所给的信息和例图的内容&#xff0c;这不就是最长公共子序列吗&#xff1f;&#xff0c;我们把最长公共子序列连线起…...

编程新知 2025/11/25 16:44:30