前端搭建砸地鼠游戏（内附源码）

news2024/10/6 1:59:57

The sand accumulates to form a pagoda

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

✨ 写在前面

上周我们实通过前端基础实现了打字通，当然很多伙伴再评论区提出了想法，后续我们会考虑实现的，今天还是继续按照我们原定的节奏来带领大家完成一个砸地鼠的小游戏，功能也比较简单简单，也是想借助这样一个简单的功能，然后来帮助大家了解我们JavaScript在前端中的作用， 在前面的文章当中我们也提及到我们在本系列的专栏是循序渐进从简单到复杂的过程，后续会带领大家用前端实现翻卡片、扫雷、贪吃蛇等有趣的小游戏，纯前端语言实现，都会陆续带给大家。欢迎大家订阅我们这份前端小游戏的专栏。

✨ 功能介绍

在这里插入图片描述

游戏开始后再几个鼠洞会随机出现老鼠，停留时间随机，我们需要点击老鼠分数加一，倒计时60秒会为我们计算分数，点击在玩一次可以重新开始游戏，大家可以根据自己的想法来设置游戏规则；如果大家可以跟上的话可以通过修改代码来提升难度，比如我们增加鼠洞或者我们减少老鼠存留的时长，很简单的功能大家可以尝试添加进去，如果遇到问题大家可以留言或者私信我，当然大家也可以将样式设置的非常漂亮，这里我们主要是针对前端的初学者来进行的讲解，对于样式的配置我们循序渐进。

✨ 页面搭建

创建文件

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

在这里插入图片描述

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

DOM结构搭建

<h1>砸地鼠</h1>：这是一个标题标签，用于在页面中显示标题“砸地鼠”。<div class="bigBox">...</div>：这是一个包含游戏区域的div标签，其类名为“bigBox”。<div class="wam-container">...</div>：这是游戏区域的容器，其中包含了多个“地鼠洞”，每个洞都有一个地鼠元素。这个标签的类名为“wam-container”。<div class="wam-hole">...</div>：这是地鼠洞的标签，用于容纳地鼠。这个标签的类名为“wam-hole”。<div class="wam-mole">...</div>：这是地鼠的标签，用于显示出现的地鼠。这个标签的类名为“wam-mole”。<div class="wam-score">分数: 0</div>：这是显示游戏得分的标签，初始值为0。这个标签的类名为“wam-score”。<div class="wam-message">准备好了吗？点击我开始</div>：这是显示游戏提示信息的标签，用于引导用户开始游戏。这个标签的类名为“wam-message”。总的来说，这段代码包含了一个游戏区域、得分、提示信息等元素。在后续的JavaScript代码中，会通过控制CSS样式等方式实现具体的游戏功能。

<h1>砸地鼠</h1>
<div class="bigBox">
  <div class="wam-container">
    <div class="wam-hole">
      <div class="wam-mole">
      </div>
    </div>
    <div class="wam-hole">
      <div class="wam-mole">
      </div>
    </div>
    <div class="wam-hole">
      <div class="wam-mole">
      </div>
    </div>
    <div class="wam-hole">
      <div class="wam-mole">
      </div>
    </div>
    <div class="wam-hole">
      <div class="wam-mole">
      </div>
    </div>
  </div>
  <div class="wam-score">分数: 0</div>
  <div class="wam-message">准备好了吗？点击我开始</div>
</div>

在这里插入图片描述

✨ 样式设置

我们看到了上面的的DOM已经搭建好了，但是很显然样式比较随意了，我们简单的来配置一下样式吧，其实我们本专栏也是想带领大家掌握一些逻辑所以样式方面我们就一切从简；样式设置包括游戏界面的样式，主要涉及颜色、字体、边框、内边距等属性。bigBox：设置宽度为60%，高度为400px，居中显示，并设置黄色背景色。wam-container：使用flex布局，设置高度为260px，让子元素居中显示。wam-hole：设置相对定位，宽度为100px，高度为100px，设置橙色背景色。
wam-mole：设置绝对定位，左上角对齐父元素，宽度和高度为100%。设置背景图片，并设置显示方式为none。wam-mole–up：继承了.wam-mole的样式，并且增加了display: block;属性，用于设置显示为坐标状态。wam-score：设置字体大小为2rem，居中显示。wam-message：设置字体大小为1rem，居中显示，顶部外边距为20px，并设置鼠标指针为手形。

<style>
  * {
    box-sizing: border-box;
  }

  h1 {
    text-align: center;
    line-height: 30px;
  }

  .bigBox {
    width: 60%;
    height: 400px;
    margin: 20px auto;
    background-color: #cbbb3e;
  }

  .wam-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: 260px;
  }

  .wam-hole {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 0 20px;
    background-color: #f5732d;
  }

  .wam-mole {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://img0.baidu.com/it/u=681824710,2035204775&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500');
    background-size: 100% 100%;
    display: none;
  }

  .wam-mole--up {
    display: block;
  }

  .wam-score {
    font-size: 2rem;
    text-align: center;
  }

  .wam-message {
    font-size: 1rem;
    text-align: center;
    margin-top: 20px;
    cursor: pointer;
  }
</style>

在这里插入图片描述

✨ 逻辑部分

点击出现在洞中的地鼠，以获得分数。它使用JavaScript控制游戏的逻辑和动画效果。下面是一些重要的JS函数和变量的解释：document.querySelector('.wam-container') 获取一个名为"wam-container"的类，该类是一个包含5个地鼠洞的容器。Array.from(container.querySelectorAll('.wam-hole')) 把5个地鼠洞存储在一个数组中，以便后面随机生成地鼠。

const container = document.querySelector('.wam-container');
const scoreBoard = document.querySelector('.wam-score');
const message = document.querySelector('.wam-message');
const moles = Array.from(container.querySelectorAll('.wam-hole'));

popUpMole() 用于生成地鼠。它会随机选择一个地鼠洞，并将其中一个div元素（具有名为"wam-mole"的类）向上移动，从而模拟地鼠出现的效果。它使用setTimeout()函数定时将地鼠下移，并在随机时间后再次调用自身来显示另一个地鼠。randomHole(holes) 用于随机选择一个地鼠洞。它会返回一个地鼠洞，但会避免与上一个洞重复出现。whackMole(e) 用于当你点击地鼠时获得分数。它使用e.target.matches('.wam-mole')来检查你是否真正地点击到了地鼠本身。

let lastHole;
let score = 0;
let isPlaying = false;
let timeUp = false;

// 随机时间生成地鼠
function popUpMole () {
  if (timeUp) return;
  const time = Math.random() * (1500 - 500) + 500;
  const hole = randomHole(moles);
  hole.querySelector('div').classList.add('wam-mole--up');
  setTimeout(() => {
    hole.querySelector('div').classList.remove('wam-mole--up');
    if (!timeUp) popUpMole();
  }, time);
}

// 随机选择一个地鼠洞
function randomHole (holes) {
  const idx = Math.floor(Math.random() * holes.length);
  const hole = holes[idx];
  if (hole === lastHole) return randomHole(holes);
  lastHole = hole;
  return hole;
}

// 点击地鼠
function whackMole (e) {
  if (!e.isTrusted) return; // 防止作弊
  if (!isPlaying) return;
  if (!e.target.matches('.wam-mole')) return;
  score++;
  scoreBoard.textContent = `分数: ${score}`;
  e.target.parentNode.querySelector('div').classList.remove('wam-mole--up');
}

startGame() 开始游戏。它会重置分数、将isPlaying和timeUp变量设置为true和false，并使用setTimeout()在一定时间后结束游戏。同时，它还会调用popUpMole()函数开始生成地鼠。moles.forEach(mole => mole.addEventListener('click', whackMole)); 添加一个监听器，当你点击地鼠时，调用whackMole()来获得分数。document.querySelector('.wam-message').addEventListener('click', startGame); 添加一个监听器，当你点击开始按钮时，调用startGame()函数来开始游戏。

// 开始游戏
function startGame () {
  score = 0;
  scoreBoard.textContent = '分数: 0';
  isPlaying = true;
  timeUp = false;
  message.textContent = '';
  popUpMole();
  setTimeout(() => {
    isPlaying = false;
    timeUp = true;
    message.textContent = `一分钟您的得分是: ${score}；点我再来一次！`;
  }, 60000);
}

// 初始化地鼠洞 
moles.forEach(mole => mole.addEventListener('click', whackMole));
document.querySelector('.wam-message').addEventListener('click', startGame);

在这里插入图片描述

✨ 完整代码

到这里呢我们的本节的大概逻辑就基本实现了，如果大家可以跟上的话可以通过修改代码来提升难度，比如我们增加鼠洞或者我们减少老鼠存留的时长，很简单的功能大家可以尝试添加进去，如果遇到问题大家可以留言或者私信我，当然大家也可以将样式设置的非常漂亮，这里我们主要是针对前端的初学者来进行的讲解，对于样式的配置我们循序渐进，如果你有能力可以挑战更加漂亮的界面或者更有趣的功能哦，还是一样我们将源码放在下面：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>砸地鼠</title>
  <style>
    * {
      box-sizing: border-box;
    }

    h1 {
      text-align: center;
      line-height: 30px;
    }

    .bigBox {
      width: 60%;
      height: 400px;
      margin: 20px auto;
      background-color: #cbbb3e;
    }

    .wam-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      height: 260px;
    }

    .wam-hole {
      position: relative;
      width: 100px;
      height: 100px;
      margin: 0 20px;
      background-color: #f5732d;
    }

    .wam-mole {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url('https://img0.baidu.com/it/u=681824710,2035204775&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500');
      background-size: 100% 100%;
      display: none;
    }

    .wam-mole--up {
      display: block;
    }

    .wam-score {
      font-size: 2rem;
      text-align: center;
    }

    .wam-message {
      font-size: 1rem;
      text-align: center;
      margin-top: 20px;
      cursor: pointer;
    }
  </style>
</head>

<body>
  <h1>砸地鼠</h1>
  <div class="bigBox">
    <div class="wam-container">
      <div class="wam-hole">
        <div class="wam-mole">
        </div>
      </div>
      <div class="wam-hole">
        <div class="wam-mole">
        </div>
      </div>
      <div class="wam-hole">
        <div class="wam-mole">
        </div>
      </div>
      <div class="wam-hole">
        <div class="wam-mole">
        </div>
      </div>
      <div class="wam-hole">
        <div class="wam-mole">
        </div>
      </div>
    </div>
    <div class="wam-score">分数: 0</div>
    <div class="wam-message">准备好了吗？点击我开始</div>
  </div>

  <script>
    const container = document.querySelector('.wam-container');
    const scoreBoard = document.querySelector('.wam-score');
    const message = document.querySelector('.wam-message');
    const moles = Array.from(container.querySelectorAll('.wam-hole'));

    let lastHole;
    let score = 0;
    let isPlaying = false;
    let timeUp = false;

    // 随机时间生成地鼠
    function popUpMole () {
      if (timeUp) return;
      const time = Math.random() * (1500 - 500) + 500;
      const hole = randomHole(moles);
      hole.querySelector('div').classList.add('wam-mole--up');
      setTimeout(() => {
        hole.querySelector('div').classList.remove('wam-mole--up');
        if (!timeUp) popUpMole();
      }, time);
    }

    // 随机选择一个地鼠洞
    function randomHole (holes) {
      const idx = Math.floor(Math.random() * holes.length);
      const hole = holes[idx];
      if (hole === lastHole) return randomHole(holes);
      lastHole = hole;
      return hole;
    }

    // 点击地鼠
    function whackMole (e) {
      if (!e.isTrusted) return; // 防止作弊
      if (!isPlaying) return;
      if (!e.target.matches('.wam-mole')) return;
      score++;
      scoreBoard.textContent = `分数: ${score}`;
      e.target.parentNode.querySelector('div').classList.remove('wam-mole--up');
    }
    // 开始游戏
    function startGame () {
      score = 0;
      scoreBoard.textContent = '分数: 0';
      isPlaying = true;
      timeUp = false;
      message.textContent = '';
      popUpMole();
      setTimeout(() => {
        isPlaying = false;
        timeUp = true;
        message.textContent = `一分钟您的得分是: ${score}；点我再来一次！`;
      }, 60000);
    }

    // 初始化地鼠洞 
    moles.forEach(mole => mole.addEventListener('click', whackMole));
    document.querySelector('.wam-message').addEventListener('click', startGame);
  </script>
</body>

</html>

本期推荐

在这里插入图片描述

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

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

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

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

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/526183.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

微服务---Redis实用篇-黑马头条项目-优惠卷秒杀功能(使用redis的消息队列对秒杀进行异步优化)

微服务---Redis实用篇-黑马头条项目-优惠卷秒杀功能(使用redis的消息队列对秒杀进行异步优化)

微服务—Redis实用篇-黑马头条项目-优惠卷秒杀功能(使用redis的消息队列对秒杀进行异步优化) 1、Redis消息队列 1.1 Redis消息队列-认识消息队列 什么是消息队列&#xff1a;字面意思就是存放消息的队列。最简单的消息队列模型包括3个角色&#xff1a; 消息队列&#xff1a…
阅读更多...
零基础学模拟电路--2.运算放大器的虚短和虚断

零基础学模拟电路--2.运算放大器的虚短和虚断

零基础学模拟电路–2.运算放大器的虚短和虚断 虚短&#xff1a; 虚短指在理想情况下&#xff0c;两个输入端的电位相等&#xff0c;就好像两个输入端短接在一起&#xff0c;但事实上并没有短接&#xff0c;称为“虚短”。 由虚短可得出正负输入端点位相等的结论。 虚断&…
阅读更多...
如何在 VS Code 中编写、运行C语言程序 教程

如何在 VS Code 中编写、运行C语言程序 教程

本篇目录 前言 1.下载、安装VS Code 2.安装VS code中2个插件 3.下载minGW64 4.配置系统的环境变量 5.C语言配置 6.编写一个测试程序 7.可能存在的问题 总结 前言 折腾了好久&#xff0c;终于成功地实现了在VS Code中写C语言程序&#xff0c;于是发文分享一下我的经验。 要想…
阅读更多...
FPGA实现AD采集

FPGA实现AD采集

1 理论学习&#xff08;废话篇&#xff09; ADC 模拟数字转换器&#xff08;额谈到这个&#xff0c;真的很荣幸在ADI实习的时光&#xff0c;打住不扯了&#xff09;&#xff0c;凡是涉及到模拟信号转数字信号的时候&#xff0c;都会用到ADC。   ADC的种类很多&#xff0c;有积…
阅读更多...
解决el-checkbox点击文字也会选中

解决el-checkbox点击文字也会选中

最近要做一个 多选框嵌套下拉框的一个功能&#xff0c;在点击下拉框时&#xff0c;多选框一直会被选中或者取消&#xff0c;这里做一下解决记录 首先展示一下要做的功能 出现原因&#xff1a; el 的checkbox的组件整个是由lable包裹的&#xff0c;所以重写el-checkbox就可以了…
阅读更多...
〖大前端 - 基础入门三大核心之CSS篇㉓〗- 过渡的缓动效果

〖大前端 - 基础入门三大核心之CSS篇㉓〗- 过渡的缓动效果

当前子专栏 基础入门三大核心篇 是免费开放阶段。推荐他人订阅&#xff0c;可获取扣除平台费用后的35%收益&#xff0c;文末名片加V&#xff01;说明&#xff1a;该文属于 大前端全栈架构白宝书专栏&#xff0c;目前阶段免费开放&#xff0c;购买任意白宝书体系化专栏可加入TFS…
阅读更多...
〖大前端 - 基础入门三大核心之CSS篇㉑〗- 3D变形 与空间移动

〖大前端 - 基础入门三大核心之CSS篇㉑〗- 3D变形 与空间移动

当前子专栏 基础入门三大核心篇 也是免费开放阶段。推荐他人订阅&#xff0c;可获取扣除平台费用后的35%收益。说明&#xff1a;该文属于 大前端全栈架构白宝书专栏&#xff0c;目前阶段免费开放&#xff0c;购买任意白宝书体系化专栏可加入TFS-CLUB 私域社区。福利&#xff1a…
阅读更多...
Java去除字符串中空格、制表符、回车换行的方法

Java去除字符串中空格、制表符、回车换行的方法

\t 是制表符\r\n 回车换行 注意&#xff1a;\r,\n的顺序是不能够对换的&#xff0c;否则不能实现换行的效果&#xff0e;操作系统的不同&#xff0c;换行符操也不同&#xff1a;\r&#xff1a; return 到当前行的最左边。\n&#xff1a; newline 向下移动一行&#xff0c;并不移…
阅读更多...
Reddit NFT爆火，全球最大社区论坛成为Web3大规模应用前哨站

Reddit NFT爆火，全球最大社区论坛成为Web3大规模应用前哨站

这是白话区块链的第1804期原创 作者 | 火火出品&#xff5c;白话区块链&#xff08;ID&#xff1a;hellobtc&#xff09; 据Dune Analytics最新数据显示&#xff0c;Reddit于Polygon网络发行的NFT系列Reddit Collectible Avatar销售总量已突破9万笔&#xff0c;在12月7日达到94…
阅读更多...
火灾报警电路设计

火灾报警电路设计

火灾报警电路设计 设计一个火灾报警电路&#xff1a;有一火灾报警系统&#xff0c;设有烟感、温感和紫外线 光感3种类型的火灾探测器。为了防止误报警&#xff0c;只有当其中有两种或两种以 上类型的探测器发出火灾检测信号时&#xff0c;报警系统才产生报警控制信号。设计一个…
阅读更多...
Linux驱动device_create创建字符设备文件

Linux驱动device_create创建字符设备文件

在Linux中有两种创建字符设备的方法&#xff0c;一种是通过mknod手动进行设备文件创建&#xff0c;第二种是通过device_create函数进行设备文件创建。在驱动开发中常用第二种方式进行设备文件的创建。 class_create和device_create 先来了解一下跟设备文件创建相关的两个函数。…
阅读更多...
window 以zip的方式 安装mysql5.7或mysql8，或者两个一起安装Mysql5.7和Mysql8、或其他的版本也可以

window 以zip的方式 安装mysql5.7或mysql8，或者两个一起安装Mysql5.7和Mysql8、或其他的版本也可以

window 以zip的方式 安装mysql5.7或mysql8&#xff0c;或者两个一起安装Mysql5.7和Mysql8、或其他的版本也可以 注意不能同一个端口。需要创建个my.ini ,配置内容在网上查下即可 比如说 mysql8的配置文件或mysql5.7的配置&#xff0c;当然内容差别不大&#xff0c;只是需要看自…
阅读更多...
数据库系统课程设计（高校成绩管理数据库系统的设计与实现）

数据库系统课程设计（高校成绩管理数据库系统的设计与实现）

目录 1、需求分析 1 1.1 数据需求描述 1 1.2 系统功能需求 3 1.3 其他性能需求 4 2、概念结构设计 4 2.1 局部E-R图 4 2.2 全局E-R图 5 2.3 优化E-R图 6 3、逻辑结构设计 6 3.1 关系模式设计 6 3.2 数据类型定义 6 3.3 关系模式的优化 8 4、物理结构设计 9 4.1 聚…
阅读更多...
【AIGC】论文阅读神器 SciSpace 注册与测试

【AIGC】论文阅读神器 SciSpace 注册与测试

欢迎关注【youcans的 AIGC 学习笔记】原创作品 【AIGC】论文阅读神器 SciSpace 注册与测试 1. 【SciSpace】网址与用户注册1.1 官网地址&#xff1a;[【SciSpace官网】https://typeset.io](https://typeset.io)1.2 官网注册 2. 【SciSpace】实战解说2.1 导入论文2.2 论文分析2.…
阅读更多...
基于Python-sqlparse的SQL表血缘追踪解析实现

基于Python-sqlparse的SQL表血缘追踪解析实现

目录 前言 一、主线任务 1.数据治理 2.血缘追踪 3.SQL表血缘 二、实现过程 1.目标效果 2.代码实现 1.功能函数识别 2.SQL标准格式 3.解析AST树 4.最终效果&#xff1a; 点关注&#xff0c;防走丢&#xff0c;如有纰漏之处&#xff0c;请留言指教&#xff0c;非常感…
阅读更多...
eclipse的安装与配置

eclipse的安装与配置

1、下载 eclipse 下载地址&#xff1a;https://www.eclipse.org/downloads/ 点击 【Download Package】 找到JavaEE IDE&#xff0c;点击【Windows x86_64】 点击【Select Another Mirror】&#xff0c;然后点击国内任意一个大学镜像下载即可&#xff01; 下载成功后&…
阅读更多...
express的使用(一)

express的使用(一)

因为有时候没有登录CSDN,所以弄了一个订阅号&#xff0c;会不定时的更新文章(其实就是在csdn这边发布了之后搬过去&#xff0c;不过有问题的可以留言&#xff0c;csdn不常上来看)&#xff0c;欢迎订阅文章链接&#xff1a;[订阅号-express的使用(一)] ------------------------…
阅读更多...
全网首发2023全新ChatGPT3.5小程序开源源码 全新UI

全网首发2023全新ChatGPT3.5小程序开源源码 全新UI

源码简介&#xff1a; 2023全新ChatGPT3.5小程序开源源码 全新UI 全网首发 这一版本ui比较好看 回复速度也快了 小程序是java的 带后台 本来准备给你们带上接口的然后么后台是和接口连接的 我改什么内容你们前段都会显示所以全开源 自己搭建下吧&#xff0c;腾讯云买个国外服…
阅读更多...
MFC基础入门

MFC基础入门

1 MFC入门 1.1 为什么学习MFC 在Windows平台上做GUI开发&#xff0c;MFC是一个不错的选择。 学习MFC不仅可以学习到MFC本身&#xff0c;而且可以学习MFC框架的设计思想。 1.2 Windows消息机制 基本概念解释 SDK&#xff1a;软件开发工具包(Software Development Kit)&…
阅读更多...
『MySQL 实战 45 讲』15 - 两阶段提交、索引相关问题

『MySQL 实战 45 讲』15 - 两阶段提交、索引相关问题

日志和索引相关问题 mysql 两阶段提交问题 在两阶段提交的不同时刻&#xff0c;MySQL 异常重启会出现什么现象&#xff1f; 如果 crash 发生在时刻 A 由于此时 binlog 还没写&#xff0c;redo log 也还没提交&#xff0c;所以崩溃恢复的时候&#xff0c;这个事务会回滚 如果 …
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023