DeepSeek vs Kimi vs Qwen —— AI 生成俄罗斯方块代码效果横评
作者:互联网
2026-03-21
DeepSeek vs Kimi vs Qwen —— AI 生成俄罗斯方块代码效果横评
一、引言
- 背景:国产大模型崛起,代码生成能力成为核心竞争力之一
- 测试动机:以经典游戏「俄罗斯方块」为载体,直观对比三款模型的代码生成质量
- 参测模型版本说明:DeepSeek(DeepSeek-R1 Thinking + Network Search)、Kimi(Kimi 2.5 Agent)、Qwen(Qwen3.5-Plus Thinking)
二、测试方法论
-
统一 Prompt 设计
- 使用相同的提示词
- 示例 Prompt:
用原生 HTML + CSS + JavaScript 实现一个完整的俄罗斯方块游戏,包含计分、加速、游戏结束逻辑
三、各模型生成结果对比
deepseek效果
kimi效果
qwen效果
| 对比维度 | deepseek.html | kimi.html | qwen.html |
|---|---|---|---|
| 渲染方式 | Canvas 2D | DOM + CSS Grid | Canvas 2D |
| 代码架构 | 函数式(IIFE闭包) | 面向对象(Class) | 函数式(全局变量) |
| 视觉效果 | ⭐⭐⭐⭐ 深海蓝主题,精美UI | ⭐⭐⭐⭐⭐ 霓虹发光效果,最华丽 | ⭐⭐ 简洁朴素 |
| 幽灵方块(降落位置指示) | 无 | 有 | 无 |
| 暂停功能 | 无 | 有 | 无 |
| 连续移动 | 支持长按连续移动 | 单次触发 | 单次触发 |
| 计分规则 | 1/3/5/8百分制,不乘等级 | 1/3/5/8百分制,乘以等级 | 1/3/6/10十分制,乘以等级 |
| 软降加分 | 无 | 软降+1分 硬降+2×距离 | 无 |
| 升级机制 | 每消2行升级 | 每消10行升级 | 每消10行升级 |
| 速度下限 | 80ms | 100ms | 100ms |
| 代码可维护性 | 中(注释详细但耦合较高) | 高(Class封装清晰) | 低(全局变量,耦合高) |
| 代码体积 | 中 | 大 | 小(最精简) |
| 性能 | 较好(Canvas渲染) | 较差(大量DOM操作) | 好(Canvas渲染,代码轻量) |
四、总结与推荐
- 个人直观游戏体验来讲,kimi 2.5 agent生成的游戏玩起来是最舒服的,色彩华丽,功能完整、玩法丰富(包括落地指示,暂停游戏等),但是生成代码速度较慢,画面稍稍有些延迟,UI布局有些不对称
- deepseek r1色彩比较丰富,玩法比较丰富,游玩体验非常流畅
- qwen3.5-plus生成的代码行数最少,但只有最基本的玩法,色彩表现方面比较朴素,游戏运行非常流畅(仁者见仁,可能朴素的才是最好玩的)
我自己体验下来,感觉kimi生成的代码是最成熟的。个人认为是其agent模式起到了非常大的作用。kimi在代码生成期间,展示了其工作流程与步骤,显示出其首先进行了规划,制定了todo list,在代码生成前参考了许多设计文档,对代码进行了多次迭代。
五、附录
Deepseek代码
lang="zh">
charset="UTF-8">
name="viewport" content="width=device-width, initial-scale=1.0">
原生俄罗斯方块 · 经典加速计分版
class="game-container">
class="play-area">
class="info-panel">
class="next-piece">
▶ 下一个
class="score-box">
id="scoreDisplay">0
class="label">得分
class="level-box">
id="levelDisplay">0"label">级
class="status" id="gameStatus">
style="color:#89b9cd; font-size:0.75rem; margin-top:5px;">
← → 移动 ↓ 软加速 ↑ 旋转
空格 硬到底
Kimi生成代码
html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>俄罗斯方块 - Tetristitle>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
}
.game-container {
display: flex;
gap: 30px;
align-items: flex-start;
flex-wrap: wrap;
justify-content: center;
}
.game-board-wrapper {
position: relative;
}
.game-board {
display: grid;
grid-template-columns: repeat(10, 30px);
grid-template-rows: repeat(20, 30px);
gap: 1px;
background: #0a0a0a;
border: 3px solid #4a4a6a;
border-radius: 8px;
padding: 5px;
box-shadow: 0 0 30px rgba(0, 150, 255, 0.3), inset 0 0 20px rgba(0, 0, 0, 0.5);
}
.cell {
width: 30px;
height: 30px;
border-radius: 3px;
transition: all 0.1s ease;
}
.cell.empty {
background: #1a1a2a;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
}
.cell.I { background: linear-gradient(145deg, #00f5ff, #00a8b5); box-shadow: 0 0 10px rgba(0, 245, 255, 0.5); }
.cell.O { background: linear-gradient(145deg, #ffeb3b, #c9b600); box-shadow: 0 0 10px rgba(255, 235, 59, 0.5); }
.cell.T { background: linear-gradient(145deg, #e040fb, #9c00d1); box-shadow: 0 0 10px rgba(224, 64, 251, 0.5); }
.cell.S { background: linear-gradient(145deg, #76ff03, #4caf00); box-shadow: 0 0 10px rgba(118, 255, 3, 0.5); }
.cell.Z { background: linear-gradient(145deg, #ff5252, #c00000); box-shadow: 0 0 10px rgba(255, 82, 82, 0.5); }
.cell.J { background: linear-gradient(145deg, #448aff, #0057c9); box-shadow: 0 0 10px rgba(68, 138, 255, 0.5); }
.cell.L { background: linear-gradient(145deg, #ff9100, #c56200); box-shadow: 0 0 10px rgba(255, 145, 0, 0.5); }
.cell.ghost {
background: rgba(255, 255, 255, 0.1);
border: 1px dashed rgba(255, 255, 255, 0.3);
}
.side-panel {
display: flex;
flex-direction: column;
gap: 20px;
min-width: 200px;
}
.panel-box {
background: rgba(26, 26, 46, 0.9);
border: 2px solid #4a4a6a;
border-radius: 10px;
padding: 20px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
}
.panel-box h3 {
color: #00f5ff;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 15px;
text-shadow: 0 0 10px rgba(0, 245, 255, 0.5);
}
.score-value {
color: #fff;
font-size: 32px;
font-weight: bold;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.level-value, .lines-value {
color: #ffeb3b;
font-size: 24px;
font-weight: bold;
}
.next-piece-board {
display: grid;
grid-template-columns: repeat(4, 25px);
grid-template-rows: repeat(4, 25px);
gap: 2px;
justify-content: center;
margin-top: 10px;
}
.next-cell {
width: 25px;
height: 25px;
border-radius: 3px;
}
.next-cell.empty {
background: transparent;
}
.controls-info {
color: #aaa;
font-size: 12px;
line-height: 1.8;
}
.controls-info span {
color: #00f5ff;
font-weight: bold;
}
.btn {
padding: 15px 30px;
font-size: 16px;
font-weight: bold;
border: none;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 1px;
}
.btn-start {
background: linear-gradient(145deg, #00f5ff, #00a8b5);
color: #1a1a2e;
box-shadow: 0 5px 20px rgba(0, 245, 255, 0.4);
}
.btn-start:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 245, 255, 0.6);
}
.btn-pause {
background: linear-gradient(145deg, #ff9100, #c56200);
color: #fff;
box-shadow: 0 5px 20px rgba(255, 145, 0, 0.4);
}
.btn-pause:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 145, 0, 0.6);
}
.game-over-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.85);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 8px;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}
.game-over-overlay.active {
opacity: 1;
visibility: visible;
}
.game-over-text {
color: #ff5252;
font-size: 36px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 3px;
margin-bottom: 20px;
text-shadow: 0 0 20px rgba(255, 82, 82, 0.8);
animation: pulse 1.5s infinite;
}
@keyframes pulse {
0%, 100% { transform: scale(1); }
50% { transform: scale(1.05); }
}
.final-score {
color: #fff;
font-size: 20px;
margin-bottom: 30px;
}
.final-score span {
color: #00f5ff;
font-size: 28px;
font-weight: bold;
}
.title {
text-align: center;
margin-bottom: 30px;
}
.title h1 {
color: #fff;
font-size: 42px;
text-transform: uppercase;
letter-spacing: 5px;
text-shadow: 0 0 20px rgba(0, 245, 255, 0.5);
background: linear-gradient(90deg, #00f5ff, #ffeb3b, #e040fb, #00f5ff);
background-size: 300% 100%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: gradient 3s linear infinite;
}
@keyframes gradient {
0% { background-position: 0% 50%; }
100% { background-position: 300% 50%; }
}
.mobile-controls {
display: none;
gap: 10px;
justify-content: center;
margin-top: 20px;
}
.mobile-btn {
width: 60px;
height: 60px;
border-radius: 50%;
border: none;
background: rgba(0, 245, 255, 0.2);
color: #00f5ff;
font-size: 24px;
cursor: pointer;
border: 2px solid #00f5ff;
transition: all 0.2s ease;
}
.mobile-btn:active {
background: rgba(0, 245, 255, 0.5);
transform: scale(0.95);
}
@media (max-width: 600px) {
.game-board {
grid-template-columns: repeat(10, 25px);
grid-template-rows: repeat(20, 25px);
}
.cell {
width: 25px;
height: 25px;
}
.side-panel {
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.mobile-controls {
display: flex;
}
}
style>
<base target="_blank">
head>
<body>
<div class="wrapper">
<div class="title">
<h1>俄罗斯方块h1>
div>
<div class="game-container">
<div class="game-board-wrapper">
<div class="game-board" id="gameBoard">div>
<div class="game-over-overlay" id="gameOverOverlay">
<div class="game-over-text">游戏结束div>
<div class="final-score">最终得分: <span id="finalScore">0span>div>
<button class="btn btn-start" onclick="game.restart()">重新开始button>
div>
div>
<div class="side-panel">
<div class="panel-box">
<h3>得分h3>
<div class="score-value" id="score">0div>
div>
<div class="panel-box">
<h3>等级h3>
<div class="level-value" id="level">1div>
div>
<div class="panel-box">
<h3>消除行数h3>
<div class="lines-value" id="lines">0div>
div>
<div class="panel-box">
<h3>下一个h3>
<div class="next-piece-board" id="nextPiece">div>
div>
<div class="panel-box">
<h3>操作说明h3>
<div class="controls-info">
<span>←span> 左移<br>
<span>→span> 右移<br>
<span>↓span> 加速下落<br>
<span>↑span> 旋转<br>
<span>空格span> 直接落地
div>
div>
<button class="btn btn-start" id="startBtn" onclick="game.start()">开始游戏button>
<button class="btn btn-pause" id="pauseBtn" onclick="game.togglePause()" style="display: none;">暂停button>
div>
div>
<div class="mobile-controls">
<button class="mobile-btn" onclick="game.moveLeft()">←button>
<button class="mobile-btn" onclick="game.rotate()">↻button>
<button class="mobile-btn" onclick="game.moveRight()">→button>
<button class="mobile-btn" onclick="game.softDrop()">↓button>
<button class="mobile-btn" onclick="game.hardDrop()">⤓button>
div>
div>
<script>
// 俄罗斯方块游戏类
class TetrisGame {
constructor() {
// 游戏配置
this.cols = 10;
this.rows = 20;
this.board = [];
this.score = 0;
this.level = 1;
this.lines = 0;
this.isGameOver = false;
this.isPlaying = false;
this.isPaused = false;
this.dropInterval = 1000;
this.lastDropTime = 0;
this.animationId = null;
// 方块形状定义
this.pieces = {
I: {
shape: [
[0, 0, 0, 0],
[1, 1, 1, 1],
[0, 0, 0, 0],
[0, 0, 0, 0]
],
color: 'I'
},
O: {
shape: [
[1, 1],
[1, 1]
],
color: 'O'
},
T: {
shape: [
[0, 1, 0],
[1, 1, 1],
[0, 0, 0]
],
color: 'T'
},
S: {
shape: [
[0, 1, 1],
[1, 1, 0],
[0, 0, 0]
],
color: 'S'
},
Z: {
shape: [
[1, 1, 0],
[0, 1, 1],
[0, 0, 0]
],
color: 'Z'
},
J: {
shape: [
[1, 0, 0],
[1, 1, 1],
[0, 0, 0]
],
color: 'J'
},
L: {
shape: [
[0, 0, 1],
[1, 1, 1],
[0, 0, 0]
],
color: 'L'
}
};
this.pieceTypes = Object.keys(this.pieces);
this.currentPiece = null;
this.nextPiece = null;
this.ghostPiece = null;
// 初始化
this.initBoard();
this.renderBoard();
this.bindEvents();
}
// 初始化游戏板
initBoard() {
this.board = Array(this.rows).fill(null).map(() =>
Array(this.cols).fill(0)
);
}
// 渲染游戏板
renderBoard() {
const boardEl = document.getElementById('gameBoard');
boardEl.innerHTML = '';
for (let row = 0; row < this.rows; row++) {
for (let col = 0; col < this.cols; col++) {
const cell = document.createElement('div');
cell.className = 'cell empty';
cell.dataset.row = row;
cell.dataset.col = col;
boardEl.appendChild(cell);
}
}
}
// 更新显示
updateDisplay() {
const cells = document.querySelectorAll('.game-board .cell');
// 清空所有单元格
cells.forEach(cell => {
cell.className = 'cell empty';
});
// 绘制已固定的方块
for (let row = 0; row < this.rows; row++) {
for (let col = 0; col < this.cols; col++) {
if (this.board[row][col]) {
const index = row * this.cols + col;
cells[index].className = `cell ${this.board[row][col]}`;
}
}
}
// 绘制幽灵方块
if (this.ghostPiece && this.isPlaying && !this.isPaused) {
this.ghostPiece.shape.forEach((row, y) => {
row.forEach((cell, x) => {
if (cell) {
const boardX = this.ghostPiece.x + x;
const boardY = this.ghostPiece.y + y;
if (boardY >= 0 && boardY < this.rows && boardX >= 0 && boardX < this.cols) {
const index = boardY * this.cols + boardX;
if (this.board[boardY][boardX] === 0) {
cells[index].className = 'cell ghost';
}
}
}
});
});
}
// 绘制当前方块
if (this.currentPiece && this.isPlaying && !this.isPaused) {
this.currentPiece.shape.forEach((row, y) => {
row.forEach((cell, x) => {
if (cell) {
const boardX = this.currentPiece.x + x;
const boardY = this.currentPiece.y + y;
if (boardY >= 0 && boardY < this.rows && boardX >= 0 && boardX < this.cols) {
const index = boardY * this.cols + boardX;
cells[index].className = `cell ${this.currentPiece.color}`;
}
}
});
});
}
// 更新分数显示
document.getElementById('score').textContent = this.score;
document.getElementById('level').textContent = this.level;
document.getElementById('lines').textContent = this.lines;
}
// 渲染下一个方块
renderNextPiece() {
const nextEl = document.getElementById('nextPiece');
nextEl.innerHTML = '';
if (!this.nextPiece) return;
const shape = this.nextPiece.shape;
const offsetX = Math.floor((4 - shape[0].length) / 2);
const offsetY = Math.floor((4 - shape.length) / 2);
for (let row = 0; row < 4; row++) {
for (let col = 0; col < 4; col++) {
const cell = document.createElement('div');
cell.className = 'next-cell empty';
const shapeRow = row - offsetY;
const shapeCol = col - offsetX;
if (shapeRow >= 0 && shapeRow < shape.length &&
shapeCol >= 0 && shapeCol < shape[0].length &&
shape[shapeRow][shapeCol]) {
cell.className = `next-cell ${this.nextPiece.color}`;
}
nextEl.appendChild(cell);
}
}
}
// 生成随机方块
randomPiece() {
const type = this.pieceTypes[Math.floor(Math.random() * this.pieceTypes.length)];
const pieceData = this.pieces[type];
return {
shape: pieceData.shape.map(row => [...row]),
color: pieceData.color,
x: Math.floor((this.cols - pieceData.shape[0].length) / 2),
y: 0
};
}
// 生成新方块
spawnPiece() {
if (this.nextPiece) {
this.currentPiece = this.nextPiece;
} else {
this.currentPiece = this.randomPiece();
}
this.nextPiece = this.randomPiece();
this.renderNextPiece();
this.updateGhostPiece();
// 检查游戏结束
if (!this.isValidPosition(this.currentPiece, this.currentPiece.x, this.currentPiece.y)) {
this.gameOver();
}
}
// 更新幽灵方块位置
updateGhostPiece() {
if (!this.currentPiece) return;
this.ghostPiece = {
shape: this.currentPiece.shape,
x: this.currentPiece.x,
y: this.currentPiece.y,
color: 'ghost'
};
// 将幽灵方块下落到底
while (this.isValidPosition(this.ghostPiece, this.ghostPiece.x, this.ghostPiece.y + 1)) {
this.ghostPiece.y++;
}
}
// 检查位置是否有效
isValidPosition(piece, x, y) {
for (let row = 0; row < piece.shape.length; row++) {
for (let col = 0; col < piece.shape[row].length; col++) {
if (piece.shape[row][col]) {
const newX = x + col;
const newY = y + row;
if (newX < 0 || newX >= this.cols || newY >= this.rows) {
return false;
}
if (newY >= 0 && this.board[newY][newX]) {
return false;
}
}
}
}
return true;
}
// 旋转方块
rotate() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
if (this.currentPiece.color === 'O') return; // O方块不需要旋转
const rotated = this.currentPiece.shape[0].map((_, i) =>
this.currentPiece.shape.map(row => row[i]).reverse()
);
const oldShape = this.currentPiece.shape;
this.currentPiece.shape = rotated;
// 如果旋转后位置无效,尝试左右移动
let offset = 0;
while (!this.isValidPosition(this.currentPiece, this.currentPiece.x, this.currentPiece.y)) {
offset = offset > 0 ? -offset : -offset + 1;
this.currentPiece.x += offset;
if (Math.abs(offset) > 2) {
this.currentPiece.shape = oldShape;
this.currentPiece.x -= offset;
return;
}
}
this.updateGhostPiece();
this.updateDisplay();
}
// 移动方块
moveLeft() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
if (this.isValidPosition(this.currentPiece, this.currentPiece.x - 1, this.currentPiece.y)) {
this.currentPiece.x--;
this.updateGhostPiece();
this.updateDisplay();
}
}
moveRight() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
if (this.isValidPosition(this.currentPiece, this.currentPiece.x + 1, this.currentPiece.y)) {
this.currentPiece.x++;
this.updateGhostPiece();
this.updateDisplay();
}
}
// 软降落(加速)
softDrop() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
if (this.isValidPosition(this.currentPiece, this.currentPiece.x, this.currentPiece.y + 1)) {
this.currentPiece.y++;
this.score += 1;
this.updateDisplay();
} else {
this.lockPiece();
}
}
// 硬降落(直接落地)
hardDrop() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
let dropDistance = 0;
while (this.isValidPosition(this.currentPiece, this.currentPiece.x, this.currentPiece.y + 1)) {
this.currentPiece.y++;
dropDistance++;
}
this.score += dropDistance * 2;
this.lockPiece();
}
// 自动下落
autoDrop() {
if (!this.isPlaying || this.isPaused || !this.currentPiece) return;
if (this.isValidPosition(this.currentPiece, this.currentPiece.x, this.currentPiece.y + 1)) {
this.currentPiece.y++;
this.updateDisplay();
} else {
this.lockPiece();
}
}
// 固定方块
lockPiece() {
if (!this.currentPiece) return;
this.currentPiece.shape.forEach((row, y) => {
row.forEach((cell, x) => {
if (cell) {
const boardY = this.currentPiece.y + y;
const boardX = this.currentPiece.x + x;
if (boardY >= 0) {
this.board[boardY][boardX] = this.currentPiece.color;
}
}
});
});
this.clearLines();
this.spawnPiece();
this.updateDisplay();
}
// 消除完整行
clearLines() {
let linesCleared = 0;
for (let row = this.rows - 1; row >= 0; row--) {
if (this.board[row].every(cell => cell !== 0)) {
this.board.splice(row, 1);
this.board.unshift(Array(this.cols).fill(0));
linesCleared++;
row++;
}
}
if (linesCleared > 0) {
this.lines += linesCleared;
// 计分系统
const points = [0, 100, 300, 500, 800];
this.score += points[linesCleared] * this.level;
// 等级提升
const newLevel = Math.floor(this.lines / 10) + 1;
if (newLevel > this.level) {
this.level = newLevel;
this.dropInterval = Math.max(100, 1000 - (this.level - 1) * 100);
}
}
}
// 游戏循环
gameLoop(timestamp) {
if (!this.isPlaying) return;
if (!this.isPaused) {
if (timestamp - this.lastDropTime > this.dropInterval) {
this.autoDrop();
this.lastDropTime = timestamp;
}
}
this.animationId = requestAnimationFrame((ts) => this.gameLoop(ts));
}
// 开始游戏
start() {
if (this.isPlaying) return;
this.reset();
this.isPlaying = true;
this.isGameOver = false;
this.spawnPiece();
document.getElementById('startBtn').style.display = 'none';
document.getElementById('pauseBtn').style.display = 'block';
document.getElementById('gameOverOverlay').classList.remove('active');
this.lastDropTime = performance.now();
this.gameLoop(performance.now());
}
// 重置游戏
reset() {
this.initBoard();
this.score = 0;
this.level = 1;
this.lines = 0;
this.dropInterval = 1000;
this.currentPiece = null;
this.nextPiece = null;
this.isGameOver = false;
this.isPaused = false;
if (this.animationId) {
cancelAnimationFrame(this.animationId);
}
this.updateDisplay();
}
// 重新开始
restart() {
this.reset();
this.start();
}
// 暂停/继续
togglePause() {
if (!this.isPlaying || this.isGameOver) return;
this.isPaused = !this.isPaused;
document.getElementById('pauseBtn').textContent = this.isPaused ? '继续' : '暂停';
if (!this.isPaused) {
this.lastDropTime = performance.now();
}
this.updateDisplay();
}
// 游戏结束
gameOver() {
this.isGameOver = true;
this.isPlaying = false;
if (this.animationId) {
cancelAnimationFrame(this.animationId);
}
document.getElementById('finalScore').textContent = this.score;
document.getElementById('gameOverOverlay').classList.add('active');
document.getElementById('pauseBtn').style.display = 'none';
}
// 绑定键盘事件
bindEvents() {
document.addEventListener('keydown', (e) => {
if (!this.isPlaying) {
if (e.code === 'Space' && !this.isGameOver) {
e.preventDefault();
this.start();
}
return;
}
if (this.isPaused && e.code !== 'Escape') return;
switch(e.code) {
case 'ArrowLeft':
e.preventDefault();
this.moveLeft();
break;
case 'ArrowRight':
e.preventDefault();
this.moveRight();
break;
case 'ArrowDown':
e.preventDefault();
this.softDrop();
break;
case 'ArrowUp':
e.preventDefault();
this.rotate();
break;
case 'Space':
e.preventDefault();
this.hardDrop();
break;
case 'Escape':
e.preventDefault();
this.togglePause();
break;
}
});
}
}
// 创建游戏实例
const game = new TetrisGame();
script>
body>
html>
qwen生成代码
lang="zh-CN">
charset="UTF-8">
name="viewport" content="width=device-width, initial-scale=1.0">
原生 JS 俄罗斯方块
class="game-container">
class="ui-panel">
class="stat-box">
class="stat-label">分数 (Score)
class="stat-value" id="score">0
class="stat-box">
class="stat-label">等级 (Level)
class="stat-value" id="level">1
class="controls-info">
← → : 移动
↑ : 旋转
↓ : 加速下落
id="game-over-modal">
GAME OVER
最终得分:id="final-score">0
相关标签:
DeepSeek
相关推荐
专题
+ 收藏
+ 收藏
+ 收藏
+ 收藏
+ 收藏
最新数据
相关文章
OpenClaw 真正的效率开关,不是 Prompt,而是多会话和子代理
03/30
10款免费AI语音输入工具与软件 轻松实现语音转文字
03/30
MCP 协议深度解析:构建 AI Agent 的「万能接口」标准
03/30
WorkAny Bot 云端AI Agent工具采用OpenClaw框架构建
03/30
Anthropic 的 Harness 启示:当 AI Agent 开始「长跑」,架构才是真正的天花板
03/30
SkyBot由Skywork研发的云电脑AI助手
03/30
AI Agent 智能体 - Multi-Agent 架构入门
03/30
Nano Banana 2 国内使用指南 LiblibAI 无需翻墙教程
03/30
一文搞懂卷积神经网络经典架构-LeNet
03/30
一文搞懂深度学习中的池化!
03/30
AI精选
