0

给定以下html：

<div>
    <div id="element-0"></div>
    <div id="element-1"></div>
    <div id="element-2"></div>
    <input id="element-3"></input>
    <div id="element-4"></div>
    <div id="element-5"></div>
    <div id="element-6"></div>
</div>

如果要删除 id 为 2 和 4 的元素，我如何重置（如果更容易，使用 jquery 或 javascript）所有这些元素的 id，最终结果为：

 <div>
    <div id="element-0"></div>
    <div id="element-1"></div>
    <input id="element-2"></div>
    <div id="element-3"></div>
    <div id="element-4"></div>
</div>

谢谢您的帮助！

4

3 回答 3

1 
function resetIndexes() {
    var els = $('div *'), i;

    for(i = 0; i < els.length; i++){
        els.eq(i).attr('id', 'element-' + i);
    }
}
于 2012-04-30T17:51:12.673 回答
1

其他答案还可以，但可能不够稳健。例如，@Xander 的回答没有考虑到其中一个元素input不是 a div。@thecodeparadox 的答案依赖于封闭的每个孩子div都有一个“元素-”ID。

要彻底做到这一点，您必须遍历 DOM 中的所有元素并查看它们的 ID 是否以“element-”开头，然后相应地更改 ID。

我首先编写了一个函数来获取所有以“element-”开头的元素：

function getElements() {
  return $('html').find('*').filter( function() {
    var id = $(this).attr('id');
    return id && id.indexOf( "element-" ) == 0;
  } );
}

然后是一个重新排序 ID 的函数：

function reorderIds() {
  var idx = 0;
  getElements().each( function() {
    $(this).attr( 'id', 'element-' + idx++ );
  } );
}

你可以在这里看到我的 jsfiddle：http: //jsfiddle.net/22CzQ/4/

于 2012-04-30T18:25:06.410 回答
0 
<div id="elements">
    <div id="element-0"></div>
    <div id="element-1"></div>
    <div id="element-2"></div>
    <input id="element-3"></div> // your markup has error here remove the </div>
    <div id="element-4"></div>
    <div id="element-5"></div>
    <div id="element-6"></div>
</div>


$('#elements').children().each(function(index, val) {
  $(this).attr('id', 'element-' + index);
});
于 2012-04-30T17:51:44.400 回答