使用Javascript更改元素ID

我正在尝试将id“character”更改为“characterSelected”

var character = document.getElementById('character');
var characterSelected = document.getElementById('characterSelected');

function klik() {
    character.innerHTML = characterSelected;
}

character.addEventListener('click', klik);

这是我目前为止所做的，但似乎不起作用。我只想使用Javascript，不使用jQuery

---

谢谢

您尝试了一些东西，但没有效果。现在是查找错误使用的标准属性和函数的时候了。如果猜测不起作用，请始终寻找可靠的文档

Mozilla开发者网络MDN是一个很好的参考。这是一本关于网络、标准和当前浏览器兼容性的wiki风格的百科全书。如果您查看关于的页面，您会发现以下内容：

Element.innerHTML属性设置或获取描述 元素的子元素

这意味着innerHTML属性用于替换标记的内容，就像您在标记中编写HTML一样。不是你想要的

您想要的是更改元素的id。如果搜索元素id，您将在页面上着陆。还有一个例子说明了它的实用性：

但是，这并不能解决您的问题。你看，在尝试使用getElementById函数时，你猜错了。此函数查看页面并立即查找具有该id的元素。如果一开始没有任何具有characterSelected id的元素，那么您设置的此变量将在剩余时间内为null。当在页面中放置具有该id的元素时，变量不会神奇地更新

最后，你已经错过了它本身的目的

其目的是在使用片段链接时识别元素 使用CSS进行标识符、脚本或样式设置

---

id的目的是唯一地标识元素。你可能会想：这就是我在做的。否。您使用的是一个id来表示是否选择了一个元素。这是错误的。根据您的目标，我会说：只需将所选元素存储在变量中即可。然后，每当您需要对所选元素执行某些操作时，它就在该变量中。如果您需要该元素的特定样式，那么可以为其设置一个类。但是id根本就不是用来做这件事的——事实上，一旦元素被放置，id就不会改变。

您应该了解一下DOM是如何工作的。一旦你这样做了，这些东西就更有意义了，你就不会猜测解决方案。至于你的问题，你似乎心里有个想法，但只是在尝试解决方案，而不是完全描述问题。你最终想要达到的目标是什么，使你认为你需要更改元素的ID？我想更改单击图像时图像的css。首先，请注意下面答案中给出的建议。至于您的问题，如果您有一个ID字符的元素，并且您希望在单击时更改其CSS属性，请将klik函数中的代码更改为类似以下内容。style.color=red；或者别的什么。或者您可以添加一个CSS类来更新它的样式，这通常更干净。this.classList.addsomeClassName

var idStr = elt.id; // Get the id.
elt.id = idStr; // Set the id