Javascript 为什么不是'；我的滑块益智游戏不能正常工作吗？

我不太擅长JS，但我想做一个滑块益智游戏，但不是一个图像，我希望每个可滑动块都是一个单词，现在网格是25 x 25。这些单词将形成一首诗，“玩”这个小游戏的人必须能够以不同的顺序重新排列所有单词，这样他才能创作自己的诗

我查了一些其他的幻灯片拼图，并试图复制它们，但问题是，我不是在处理图像，而是在处理单独的单词。因此，当一个块被移动时，单词不会随之移动

函数交换选项（单元1、单元2）{
var temp=document.getElementById（cell1）.className；
document.getElementById（cell1）.className=document.getElementById（cell2）.className；
document.getElementById（cell2）.className=temp；
}
函数shuffle（）{
//使用嵌套循环访问3x3网格的每个单元格
对于（变量行=1；行1）{
if（document.getElementById（“单元格”+（行-1）+列）.className==“tile25”）{
交换选项（“单元格”+行+列，“单元格”+（行-1）+列）；
返回；
}
}
//检查白色瓷砖是否在下方
如果（第5行）{
if（document.getElementById（“单元格”+（行+1）+列）.className==“tile25”）{
交换选项（“单元格”+行+列，“单元格”+（行+1）+列）；
返回；
}
}
}
}

*{
字体系列：“Playfair显示”，衬线；
-webkit用户选择：无；
/*狩猎*/
-moz用户选择：无；
/*火狐*/
-ms用户选择：无；
/*IE10+/Edge*/
用户选择：无；
/*标准*/
}
身体{
背景：白色；
}
.tile1，
.tile2，
.第3条，
.第4条，
.第5条，
.第6条，
.tile7，
.直到8，
.直到9日，
.tile10，
.第11页，
.第12页，
.第13页，
.第14页，
.第15页，
.第16页，
.第17页，
.第18页，
.第19页，
.第20条，
.第21条，
.第22条，
.第23页，
.瓷砖24{
显示：表格单元格；
宽度：120px；
高度：120px；
文本对齐：居中；
垂直对齐：中间对齐；
背景颜色：浅灰色；
字号：10pt；
光标：指针；
边框：2倍纯白；
}
.瓷砖25{
背景色：白色；
显示：表格单元格；
宽度：120px；
高度：120opx；
不透明度：0.4；
文本对齐：居中；
垂直对齐：中间对齐；
}
#桌子{
显示：表格；
}
#第1行，
#第2行，
#第3行，
#第4行，
#第5行{
显示：表格行；
}

巴纳宁
普鲁曼
ADVOCADOS
红辣椒
RADIJZEN
布劳韦·贝森
阿布里科赞
维杰根
维特·德鲁伊文
芒果
猕猴桃
上诉
佩伦
MANDARIJNEN
马德鲁伊文
针叶树
布雷曼
小胡瓜
弗拉姆博赞
科科斯诺顿
克森
木瓜
梅洛宁
达德尔
新游戏

缺少要交换的文本内容。只是在下面的代码中添加了它

函数交换选项（单元1、单元2）{
var elem1=document.getElementById（cell1），
elem2=document.getElementById（cell2）；
var tempClass=elem1.className；
var testext=elem1.textContent；
elem1.className=elem2.className；
elem1.textContent=elem2.textContent；
elem2.className=tempClass；
elem2.textContent=testext；
}
函数shuffle（）{
//使用嵌套循环访问3x3网格的每个单元格
对于（变量行=1；行1）{
if（document.getElementById（“单元格”+（行-1）+列）.className==“tile25”）{
交换选项（“单元格”+行+列，“单元格”+（行-1）+列）；
返回；
}
}
//检查白色瓷砖是否在下方
如果（第5行）{
if（document.getElementById（“单元格”+（行+1）+列）.className==“tile25”）{
交换选项（“单元格”+行+列，“单元格”+（行+1）+列）；
返回；
}
}
}
}

*{
字体系列：“Playfair显示”，衬线；
-webkit用户选择：无；
/*狩猎*/
-moz用户选择：无；
/*火狐*/
-ms用户选择：无；
/*IE10+/Edge*/
用户选择：无；
/*标准*/
}
身体{
背景：白色；
}
.tile1，
.tile2，
.第3条，
.第4条，
.第5条，
.第6条，
.tile7，
.直到8，
.直到9日，
.tile10，
.第11页，
.第12页，
.第13页，
.第14页，
.第15页，
.第16页，
.第17页，
.第18页，
.第19页，
.第20条，
.第21条，
.第22条，
.第23页，
.瓷砖24{
显示：表格单元格；
宽度：120px；
高度：120px；
文本对齐：居中；
垂直对齐：中间对齐；
背景颜色：浅灰色；
字号：10pt；
光标：指针；
边框：2倍纯白；
}
.瓷砖25{
背景色：白色；
显示：表格单元格；
宽度：120px；
高度：120opx；
不透明度：0.4；
文本对齐：居中；
垂直对齐：中间对齐；
}
#桌子{
显示：表格；
}
#第1行，
#第2行，
#第3行，
#第4行，
#第5行{
显示：表格行；
}

巴纳宁
普鲁曼
ADVOCADOS
红辣椒
RADIJZEN
布劳韦·贝森
阿布里科赞
维杰根
维特·德鲁伊文
芒果
猕猴桃
上诉
佩伦
MANDARIJNEN
马德鲁伊文
针叶树
布雷曼
小胡瓜
弗拉姆博赞
科科斯诺顿
克森
木瓜
梅洛宁
达德尔
新游戏

因为您只是更改元素的样式，所以您没有移动任何元素知道如何修复它吗？只是一个指向正确方向的链接？如果你想让Temani Afif回复，你需要使用

@

符号回复他的评论。例如@Temaniafif如果你觉得这个答案对你有效，请将其标记为已接受的答案，这将有助于社区。