2008-12-07 17 views
244

Necesito cambiar el ID de un elemento usando jQuery.Cambiar el ID de un elemento con jQuery

Al parecer estos no funcionan:

jQuery(this).prev("li").attr("id")="newid" 
jQuery(this).prev("li")="newid" 

descubrí que puedo hacer que suceda con el siguiente código:

jQuery(this).prev("li")show(function() { 
    this.id="newid"; 
}); 

Pero eso no me parece bien. Debe haber una mejor manera, ¿no? Además, en caso de que no exista, ¿qué otro método puedo usar en lugar de mostrar/ocultar u otros efectos? Obviamente no quiero mostrar/ocultar o afectar el elemento cada vez, solo para cambiar su ID.

(Sí, soy un novato jQuery.)

Editar
no puedo usar las clases en este caso, hay que utilizar los ID.

+5

En JavaScript, se puede asignar a una variable ('foo = 1'), un miembro de un objeto (' foo.bar = 2' o 'foo ['bar'] = 2') o un subíndice de matriz (' foo [0] = 3'), pero asignando a una expresión, como el resultado de un operador ('(x + b) = 5') o el resultado de una llamada a función ('foo() = 1',' foo (x) .bar (y) = 7') no tiene ningún sentido, por lo que definitivamente no va a ser la forma en que funcionan las cosas en jQuery o cualquier otro Biblioteca de JavaScript – rakslice

Respuesta

441

Su sintaxis es incorrecta, debe pasar el valor como segundo parámetro:

jQuery(this).prev("li").attr("id","newId"); 
+2

Creo que newId debe estar entre comillas –

+5

¿No necesita separar el elemento del DOM y reemplazarlo con un nuevo elemento con una nueva ID en su lugar? Para evitar romper el DOM ...? – roosteronacid

+14

jQuery se encarga de eso, roosteronacid. – McPherrinM

5

No estoy seguro de cuál es su objetivo, pero ¿podría ser mejor utilizar addClass en su lugar? Quiero decir que una ID de objeto en mi opinión debería ser estática y específica para ese objeto. Si solo está tratando de cambiarlo para que no aparezca en la página o algo así, pondría esos detalles en una clase y luego lo agregaría al objeto en lugar de intentar cambiar su ID. Una vez más, estoy diciendo que sin entender su objetivo subrayado.

+0

Tengo que usar los identificadores como una forma de hackear un sistema existente. no hay forma de evitarlo ... – yoavf

+2

las alegrías de los sistemas legados. Entiendo tu dolor en ese momento. La respuesta de Eran es definitivamente la mejor entonces. –

+3

En realidad, configurar el ID es útil y vale la pena hacerlo si estás creando el DOM utilizando plantillas ocultas en el HTML y luego clonándolas con jquery. –

39

Lo que quiere decir que hacer es:

jQuery(this).prev("li").attr("id", "newID"); 

que establecerá el ID para el nuevo ID

8

me hizo algo parecido con esta construcción

$('li').each(function(){ 
    if(this.id){ 
    this.id = this.id+"something"; 
    } 
}); 
0

La respuesta de Eran es buena, pero me gustaría agregarla. Necesita ver cualquier interactividad que no esté en línea con el objeto (es decir, si un evento onclick llama a una función, todavía lo hará), pero si hay algún manejo de eventos javascript o jQuery adjunto a esa ID, será básicamente abandonado :

$("#myId").on("click", function() {}); 

Si el ID ahora ha cambiado a # myID123, la función se coloca arriba ya no funcionará correctamente desde mi experiencia.

37

una opción preferente sobre .attr es utilizar .prop así:

$(this).prev('li').prop('id', 'newId'); 

.attr recupera el atributo del elemento mientras que .prop recupera la propiedad de que las referencias a atributos (es decir, lo que está realidad con la intención de modificar)

+2

.attr ha quedado en desuso, esta es la forma correcta de hacerlo. – PointlessSpike

+3

¿De dónde viene esta información? http://api.jquery.com/attr/ no dice nada sobre desaprobación ... – Sergej

+0

No está en desuso. "** A partir de jQuery 1.6 **, el método' .prop() 'proporciona una forma de recuperar explícitamente valores de propiedad, mientras que' .attr() 'recupera atributos." – Illuminator

0
<script> 
     $(document).ready(function() { 
      $('select').attr("id", "newId"); //direct descendant of a 
     }); 
</script> 

Esto podría hacer por todo propósito. Solo agregue antes de la etiqueta de cierre del cuerpo y no para obtener agregar Jquery.min.js

2
$("#LeNomDeMaBaliseID").prop('id', 'LeNouveauNomDeMaBaliseID'); 
+1

Esta solución ya se proporcionó [aquí] (http://stackoverflow.com/a/25493852/1974224) – Cristik

+0

No envíe respuestas de solo código: siempre agregue una explicación a su código en la respuesta. – DanFromGermany

3

si desea cambiar el ID anterior luego muestran ahora en el ejemplo

<label id="myOldId">Change id....</label> 

y chage por el uso de Java-script

<script type="text/javascript" src="jQuery-1.7.2.js"></script> 

<script> 
$(document).ready(function() { 

    $('#myOldId').attr('id', 'newID'); 

    }); 
</script> 
Cuestiones relacionadas