-1

Sou bastante leigo em JavaScript e jQuery, e estava precisando alterar os id's das divs em ordem numérica.

Por exemplo:

<div id="1"></div>
<div id="2"></div>
<div id="8"></div>
<div id="11"></div>

e transformar em:

<div id="1"></div>
<div id="2"></div>
<div id="3"></div>
<div id="4"></div>

Alguém sabe um método pra fazer isso?

2 Respostas 2

0

Usando JavaScript puro você pode criar um nodelist com document.querySelectorAll("div") e depois iterar com for alterando os id's:

var divs = document.querySelectorAll("div");
for(var x = 0; x < divs.length; x++){
   divs[x].id = x+1;
   
   // linha abaixo só para visualização
   console.log(divs[x].outerHTML);
}
<div id="1"></div>
<div id="2"></div>
<div id="8"></div>
<div id="11"></div>

1
  • Muito obrigado cara, irei utilizar
    – Eric Paiva
    9/01/2019 às 12:31
0

Podemos utilizar a função each (função que efetua um loop) para percorrermos todas as div do nosso HTML.

Essa função irá realizar um loop em todas as divs (nós especificamos que será nas divs no comando $(div)), e temos também o índice atual do loop no parâmetro index, e o elemento atual (div atual) no parâmetro element. Agora basta definirmos o novo valor para nosso atributo id, utilizando a função attr() do JQuery.

$('div').each(function(index, element) { 
    // Já que o índice começa em zero então vamos definir o novo id como índice + 1
    $(element).attr('id', index + 1);
});

Você pode ver o exemplo funcionando aqui: https://jsfiddle.net/o2gxgz9r/76342/

1
  • Obrigado, esse método funcionou também
    – Eric Paiva
    9/01/2019 às 12:32

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .