gpt4 book ai didi

javascript - 在javascript中切换id名称

转载 作者:行者123 更新时间:2023-11-28 04:19:36 25 4
gpt4 key购买 nike

使用 html 和 javascript 在棋盘上工作。我正在尝试添加一个功能,以便用户可以翻转板的视角并遇到我理解的故障,但无法弄清楚如何解决。代码如下....

function flipBoard(){

document.getElementById("a8").id = "h1";
document.getElementById("a7").id = "h2";
document.getElementById("a6").id = "h3";
document.getElementById("a5").id = "h4";
document.getElementById("a4").id = "h5";
document.getElementById("a3").id = "h6";
document.getElementById("a2").id = "h7";
document.getElementById("a1").id = "h8";

document.getElementById("h8").id = "a1";
document.getElementById("h7").id = "a2";
document.getElementById("h6").id = "a3";
document.getElementById("h5").id = "a4";
document.getElementById("h4").id = "a5";
document.getElementById("h3").id = "a6";
document.getElementById("h2").id = "a7";
document.getElementById("h1").id = "a8";
}

所以....我认为这会工作得很好,但发现这对我的棋盘造成了严重破坏,因为棋盘两边的位置都是半白半黑。问题当然是在原来的“a1”方 block 被重命名为“h8”之后,现在有两个“h8”方 block ,在代码的末尾它切换回“a1”。

我不知道如何让 id 名称同时切换,否则我必须添加一大堆代码将 id 名称切换为某个第三个名称作为占位符,然后再将它们切换到想要的名字。可能,但很乏味,我觉得必须有一种更简单的方法来做到这一点。

有什么想法吗?

最佳答案

您可以通过在循环中以编程方式生成 id 值来减少当前代码的重复:

function flipBoard(){
var a, h, aVal, hVal, aEl, hEl;

for(a = 8, h = 1; a > 0; --a, ++h) {
aVal = 'a' + a;
hVal = 'h' + h;

// Store off the current values
aEl = document.getElementById(aVal);
hEl = document.getElementById(hVal);

// swap them
aEl.id = hVal;
hEl.id = aVal;
}
}

demo fiddle

关于javascript - 在javascript中切换id名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25635829/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com