Question

我有一个表单，允许用户动态添加元素（可能是字段集或文本框）。我可以在添加元素时为元素分配新的ID但是我无法按顺序创建它，因为用户也可以在其间添加元素。

因此，例如，有一个名为XXX1的Id，用户在其后面添加一个新元素xxx2。现在，如果用户在XXX1之后再次添加新元素，则会显示为XXX3。所以元素的顺序是XXX1，XXX3，XXX2。我无法在添加名称时控制名称。所以我试图在添加后重新分配名称。

我正在尝试获取数组中的所有元素并按如下所示更改ID

document.getElementById('xxx3').setAttribute('id', 'xxx2');

但是这不起作用，因为另一个元素已经存在ID XXX2。请帮我解决这个问题。

Answer 1

那么为什么不首先更改xxx2的ID，将其移开，然后将其重新放回原位？

document.getElementById('xxx2').setAttribute('id', 'temporaryId');
document.getElementById('xxx3').setAttribute('id', 'xxx2');
document.getElementById('temporaryId').setAttribute('id', 'xxx3');

Answer 2

为什么不从最后一个元素转到第一个元素（在插入位置之后的那个元素）并在ID中添加一个？

例如：

var insertAt = 2; // for an element to be called xxx2
var els = [...]; // an array with all of the elements
if(els.length >= insertAt){
  for(var i = els.length-1; i >= insertAt-1; --i){
    els[i].setAttribute('id', 'xxx'+(i+2));
  }
}
// Add the new element here which will be called xxx2

更改html元素的ID

2 个答案: