Cambiar la identificación de un elemento con jQuery

302

Necesito cambiar la identificación de un elemento usando 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 correcto. 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 clases en este caso, debo usar ID.

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

Respuestas:

521

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

jQuery(this).prev("li").attr("id","newId");
Eran Galperin
fuente
44
Creo que newId debería estar entre comillas
Jay Corbett
55
¿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 ...?
cllpse
15
jQuery se encarga de eso, roosteronacid.
McPherrinM
15
llegué aquí revisando la reasignación de la identificación, ¿debería ser ahora en .prop( ... )lugar de .attr( ... )?
Carl
2
@Carl de acuerdo con los últimos documentos y ejemplos de jquery, idaún debe configurarse usandoattr(...)
JoeBrockhaus el
71

UNA OPCIÓN PREFERIDA .attr es usar .propasí:

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

.attrrecupera el atributo del elemento mientras que .proprecupera la propiedad a la que hace referencia el atributo (es decir, lo que realmente tiene la intención de modificar)

Jeremy Moritz
fuente
44
.attr ha quedado en desuso, esta es la forma correcta de hacerlo.
PointlessSpike
77
¿De dónde viene esta información? api.jquery.com/attr no dice nada acerca de la despreciación ...
Sergej
No está en desuso. " A partir de jQuery 1.6 , el .prop()método proporciona una forma de recuperar explícitamente los valores de propiedad, mientras .attr()recupera los atributos".
Iluminador
@Illuminator Corregí mi respuesta en consecuencia. Gracias.
Jeremy Moritz
45

Lo que quieres decir es:

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

Eso establecerá la ID a la nueva ID

Pim Jager
fuente
11

Hice algo similar con esta construcción

$('li').each(function(){
  if(this.id){
    this.id = this.id+"something";
  }
});
Petr Safar
fuente
7

No estoy seguro de cuál es su objetivo, pero ¿podría ser mejor usar addClass en su lugar? Quiero decir que una identificación de objetos en mi opinión debe ser estática y específica para ese objeto. Si solo está tratando de cambiarlo para que no se muestre en la página o algo así, pondría esos detalles en una clase y luego lo agregaría al objeto en lugar de tratar de cambiar su ID. Una vez más, lo digo sin comprender tu objetivo subyacente.

Tim Knight
fuente
3
Las alegrías de los sistemas heredados. Entonces entiendo tu dolor. La respuesta de Eran es definitivamente la mejor entonces.
Tim Knight
55
En realidad, configurar la identificación es algo útil y útil si está creando el DOM utilizando plantillas ocultas en el HTML y luego clonándolas con jquery.
Steve Knight
5
$("#LeNomDeMaBaliseID").prop('id', 'LeNouveauNomDeMaBaliseID');
Sébastien
fuente
1
Esta solución ya se proporcionó aquí
Cristik
1
No publique respuestas de solo código: siempre agregue una explicación a su código en la respuesta.
Daniel W.
2
<script>
       $(document).ready(function () {
           $('select').attr("id", "newId"); //direct descendant of a
       });
</script>

Esto podría hacer para todo propósito. Simplemente agregue antes de que su cuerpo cierre la etiqueta y no pueda agregar Jquery.min.js

Prassanna D Manikandan
fuente
0

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

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

Si la ID ahora se cambia a # myID123, la función adjunta arriba ya no funcionará correctamente desde mi experiencia.

rfornal
fuente