Configuración dinámica de div id en JavaScript o jQuery

Question

¿Cómo se establece div id de forma dinámica? Aquí está mi código:

<div id="q1"></div> 
<div id="q2"></div> 
<div id="q3"></div> 
<div id="q4"></div> 
<div id="q5"></div> 

Ahora quiero establecer el q4 div id en q1 algo así en JavaScript. ¿Cómo puedo hacer eso en JavaScript o jQuery?

He intentado esto.

document.getElementById("q4").id = "q1"; 
document.getElementById("q2").id = "q5"; 

pero dice que el objeto es nulo o indefinido.

Gracias. chakri.

Answer 1

$('#q1').attr('id', 'q4') que el trabajo soulde creo ...

EDIT:

Si aún así no funciona intente poner esto antes </body>:

<script> 
    $(document).ready(function(){ 
     $('#q1').attr('id', 'q4') 
    }); 
</sript> 

Answer 2

en jQuery usted puede hacer esto:

$('#q4').attr('id', 'q1'); 

Sin embargo, tenga en cuenta que eso ahora lo dejará con marcas no válidas , ya que no puede usar la misma ID más de una vez en un documento.

Answer 3

Su código es correcto, lo que significa que si está fallando, probablemente esté ejecutando el JavaScript antes de que esos elementos se hayan definido en el DOM. Intente mover el bloque de scripts al debajo de esos elementos (por ejemplo, la parte inferior de la página), o coloque su código en un manejador de carga/listo DOM.

---

Editar: no estoy seguro de por qué se está bajando esta votación, pero lo que sea. Si desea hacer esto en jQuery mientras se espera para el evento DOM listo, esto debería funcionar:

$(function() { 
    $('#q4').attr('id', 'q1'); 
    $('#q2').attr('id', 'q5'); 
}); 

Tenga en cuenta que la parte importante aquí no es el hecho de que al establecer la ID se realiza en jQuery JavaScript o vainilla - La parte importante es que estamos esperando hasta que el DOM esté listo para la manipulación.

Answer 4

usando jQuery:

conjunto dinámicamente uno por uno:

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

para reorganizar lo que quiere:

$('div#q4').attr('id', 'q1'); 
$('div#q2').attr('id', 'q5'); 

Answer 5

Su código funciona bien. Excepto que después de eso tendrás 2 divs con la misma identificación. Por lo tanto, ejecutará los problemas si intenta obtener q1 nuevamente.

Answer 6

Prueba esto ..

var divId = document.getElementById ('Q1');

divid.id = 'q5';

Answer 7

En primer lugar, le está dando la identificación a un elemento una identificación que ya se le dio a algún elemento antes, eso no es correcto que no pueda tener más de una identificación en su DOM.De todos modos el código sería algo así como

var element = document.getElementById('q4'); 
    element.setAttribute('id', 'q7'); 
    if(document.getElementById('q7').innerHTML = "All is well") 
      alert(document.getElementById('q7').innerHTML); //to check if the new id has been set correctly 

violín http://jsfiddle.net/kmSHB/