javascript - 使用Javascript在中间添加一个时重新编号按数字排序的div ID

Question

我正在使用 javascript 开发应用程序。我需要的是拥有 id 为 (1,2,3...) 的 div，并能够使用 jquery 在例如 2 和 3 之间插入一个 div，然后让它成为新的三个，三个变成四，四变成五，等等。我已经让 div 插入工作，我只需要知道如何重新排序 div。有任何想法吗？

Answer 1

插入新 div 后，您可以执行以下操作：

var i = 1;
$('div').each(function() {
    $(this).attr('id', i++);
});

将 $('div') 替换为您自己的选择器。

还要记住，根据您使用的 HTML 版本，id 不能以数字开头。

Answer 2

您不能以数字值开始 ID，但无论如何您都会执行类似的操作

// set a data value in the div you have just inserted into the dom and set a variable theID to the current ID you have just inserted.

$(this).data('inserted', true);
var theID = $(this).attr('id'); // this will be 3.


// now to update the other divs.
$('div').each(function() {
    if($(this).attr('id') >= theID && !$(this).data('inserted')){
        $(this).attr('id', $(this).attr('id') + 1);
    }
});

// now set the data inserted to false for future updates
$('div#3').data('inserted', false);

Answer 3

$(function() {

  reorder();

  $('#click').click(function() {

    $('<h2>hello world blah!</h2>').insertAfter('.content h2:eq(1)');
    reorder();
  });

});

function reorder() {
 $('.content h2').each(function(i) {
    $(this).attr('id', 'order_'+(i+1));
 // alert( parseInt(this.id.split('_')[1]) ); // this is the id #
 });
};

Answer 4

我很确定你从 jQuery 选择器中按 DOM 顺序取回东西，所以你不能只找到父元素，选择子<div>元素，然后.each()通过列表吗？