Posso cambiare l'ID di un elemento HTML usando Javascript?

Ho una variabile javascript obj che rappresenta un elemento nel DOM e desidero cambiare il suo ID. Ho tentato di farlo con quanto segue, il che dimostra anche che non funziona!Posso cambiare l'ID di un elemento HTML usando Javascript?

obj.id = "newID"; 

alert(obj.id); // this gives me newID as required 

var element = document.getElementById("newID"); 

if (element != null) { alert("Hooray"); // this alert never gets displayed! }

Cosa c'è di sbagliato nel mio codice sopra che significa che l'ID sembra essere cambiato ma non raccolto nel DOM? Molte grazie in anticipo.

fonte

2010-09-24 user455141

Come viene assegnato 'obj'? –

Sotto quale browser hai riprodotto questo caso? – HoLyVieR

Il "obj" è stato aggiunto al documento? – Alex

Il codice che mostri funziona; il problema è probabilmente nel codice che cerca e assegna obj. La mia ipotesi è che questo sia solo un oggetto javascript, non una parte dell'albero DOM.

fonte

2010-09-24 13:21:43

grazie - questo era esattamente il problema! – user455141

-2

Sì, è possibile, ecco una soluzione con jQuery

$("#xxx").attr("id", "yyy");

getElementById("xxx").setAttribute("id", "yyy");

fonte

2010-09-24 13:11:48

-1 L'OP non ha specificato che vogliono usare jQuery e questo dovrebbe essere raggiungibile usando puro JavaScript. Questo non sta rispondendo alla sua domanda sul motivo per cui l'ID è cambiato, ma non è stato trovato di nuovo da "getElementById". – GenericTypeTea

l'equivalente javascript è obj.setAttribute ("id", "yourid") – Tim

@Tim, in realtà 'obj.id =" foo ";' è l'equivalente più semplice. – GenericTypeTea

Non c'è alcun motivo per cui questo non dovrebbe funzionare con puro JavaScript. Ecco un working fiddle che mostra che funziona. Non dovresti avere bisogno di una soluzione jQuery o di qualsiasi altro metodo JavaScript, id = "foo"; è il modo più semplice di cambiare un ID DOM.

Dai un'occhiata al mio violino di sopra e prova a vedere qual è la differenza tra il tuo codice e il mio.

fonte

2010-09-24 13:18:29 GenericTypeTea

Dal momento che non ci hai dare l'intero codice la mia ipotesi è che probabilmente hanno qualcosa di simile a questo nel codice

obj = document.createElement("div"); 
obj.id = "something"; 

// ... 

obj.id = "newID"; 

alert(obj.id); // this gives me newID as required 

var element = document.getElementById("newID"); 

if (element != null) { alert("Hooray"); // this alert never gets displayed! }

In quel caso particolare, document.getElementById("newID") non vi restituisce nulla poiché l'elemento non è stato aggiunto alla pagina e quindi non è stato trovato nella pagina.

fonte

2010-09-24 13:19:25 HoLyVieR

Prova questo:

funziona per me

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>test</title> 
</head> 
<body bgcolor="#ffffff"> 

    <script type="text/javascript"> 
     function ChangeID(elementId, newId) { 
      var obj = document.getElementById(elementId); 
      obj.id = newId; 
     } 

     function SetContent(elementId, content) { 
      var obj = document.getElementById(elementId); 
      obj.innerHTML = content; 
     } 
    </script> 

    <div id="div1"></div> 

    <a href="#" onclick="ChangeID('div1', 'div6');">ChangeID</a><br /> 
    <a href="#" onclick="SetContent('div6', 'this is the contents');">Set Contents</a> 





</body> 
</html>

fonte

2010-09-24 13:24:43 jimplode

Non utilizzare 'javascript:' negli attributi 'onclick'; è inutile (in realtà, stai semplicemente assegnando un'etichetta JavaScript in questo modo). –

era solo esplicito. ho modificato e rimosso. – jimplode

Il codice guarda bene, anche se si sta commentando in questo modo nel codice, è possibile rendersi conto che la coppia non è mai chiusa a causa del commento .

if (element != null) { alert("Hooray"); // this alert never gets displayed! } <-- this brace

fonte

2010-09-24 13:47:29 dytrivedi

+1 - ottima cattura! –

C'è un'altra cosa da considerare. Stai cercando di farlo prima che il DOM sia pronto? L'elemento è già caricato? Se provi a cambiare un elemento che il DOM non ha nell'albero, fallirai tranquillamente.

fonte

2010-09-24 18:03:10 AutoSponge

Posso cambiare l'ID di un elemento HTML usando Javascript?

risposta

Problemi correlati