cambiare id elemento

[Lollys]

Ciao :gren:

come faccio una volta identificato l'elemento nel documento a cambiargli l'id ?

<div id="nome">

cambiarlo con

<div id="nome_nuovo">

avete qualche idea ?

[Lollys]

Vi chiedo un'altra cosa, visto che è lo stesso problema.

praticamente ho un div con dei link all'interno!
#mio_div{}
#mio_div a{}

<div id="mio_div">
<a></a>
<a></a>
<a></a>
</div>

Adesso recuperando l'id del div riesco a cambiargli la classe con javascript ma non funziona con i link.
gli do la classe nuovo_div

.nuovo_div{}
.nuovo_div a{}

però il div cambia colore ma i link no, è normale ?

------------------------------

un'altro sistema, recuperando l'id del div poi passo ai link con un ciclo e gli cambio il colore lo sfondo etc.........

elemento[].style.color="#000000";
elemento[].style.background="#ffffff";

e funziona, però mi chiedo, se riesco a passare lo stile del colore al collegamento perchè se gli passo una classe non lo prende ?

il collegamento lo prendo con getelementsbytagname("a")
se fà cosi
elemento[]style.color="";
perchè cosi no
elemento[].className="nuova_classe";

.nuovaclasse{background: #000000}


se qualcuno ha qualche idea !!!! Grazie mille

[Mich_]

Inizio a rispondere (ma non concludo).

Non credo si possa cambiare l'id ad un oggetto.

Ogni oggetto ha un suo set di proprieta`. Se cambi lo sfondo ad un oggetto esterno, questo non passa aglioggetti contenuti, a meno che questi non siano trasparenti (background:transparent;) oppure che ereditino lo sfondo: (background:inherit;).

Ciao
Michele

[Lollys]

Non ci ho capito molto, però sapresti dirmi se:

Identifico un elemento nel documento e gli cambio colore o sfondo

elemento[].style.color="#000000"

e funziona, perchè mettendogli la classe no ?

elemento[].className="nuova_classe"

............!!

In teoria dovrebbe funzionare, forse perchè l'elemento non ha un id ma viene identificato da un elemento che lo racchiude, pensi sia per questo ?

[Mich_]

La sintassi corretta e`:

document.getElementById('ID_DEL_TAG').style.color = "#000000";

document.getElementById('ID_DEL_TAG').style.classN ame = "nuova_classe";
(non ricordo se ci vuole anche il pezzo .style. in quest'ultimo).

In questi casi ID_DEL_TAG e` quello definito dall'attributo id di ogni singolo tag.

Ciao
Michele

[Lollys]

Ok .......questo lo sapevo anch'io!!! :quote:

Io comunque l'hò utilizzatto senza .style.className ma solo .className e funziona!!!

Ricapitolo un pò la situazione!!

<div id="primo_elemento">
<a></a>
<a></a>
<a></a>
</div>

come faccio a dare una classe al tag a ?
se nel css mettiamo

#primo_elemento a{}

và tutto bene ma se mettiamo solo

#primo_elemento{}

applichiamo lo stile solo al div ed è tutto ok.

se io metto questa classe

.nuova_classe a{}

e la lasciamo li, e poi la appichiamo al div
document.getElementById('primo_elemento').classNam e = "nuova_classe";

non succede nulla però se la classe è cosi

.nuova_classe{}

funziona ma solo per il div.

Allora ho cambiato sistema:

tramite uno script che ho creato riesco a recuperare tutti i tag all'interno di div ed applicargli lo stile, adesso non posto lo script, però alla fine recuper l'elemento.

elemento.style.color="#000000"

e funziona, tutti i link cambiano colore, solo che se gli applico la classe

elemento.className="nuova_classe" non và!

non capisco perchè con il colore e lo sfondo si ma con la classe no !!


ho provato a scriverla cosi:

.nuova_classe{}
a.nuova_classe{}

ma nisba niente da fare!!!!!

Non so se ci hai capito una mazza !! :master:

[Mich_]

Per assegnare una classe ad un elemento, basta che lo scrivi:

...

Poi se scrivi
.nuovaclasse {...}
ti riferisci a tutti gli elementi con quella classe,

invece se scrivi
a.nuovaclasse {...}
div.nuovaclasse {...}
la classe viene applicata solo agli elemti di quel tipo con quel nome di classe


... se posso permettermi ...
un giretto in un tutorial sui CSS non ti farebbe male.

Ciao
Michele

[Lollys]

Originariamente inviato da Mich_

... se posso permettermi ...
un giretto in un tutorial sui CSS non ti farebbe male.

Non permetterti di dirmi certe cose!! :zamm:

Comunque senza scherzare, penso che non ci siamo capiti l'uno con l'altro, ammettendo che forse non riesco a farmi capire e spiegare bene il mio problema!!

Troverò altre soluzioni, in ogni caso grazie!

Ciao

[Xinod]

ma senza cercare troppo lontano,
se la regola ha come selettore .classe a e non #id a, quando cambi al div classe con className="nuova_classe" le ancore rispettano la regola .nuova_classe a

una situazione del genere non mostra il colore (che si potrebbe supporre) corretto

<style type="text/css">
#livello a{color:#00f;}
.nuova_classe {color:#0f0;}
</style>
<div id="livello">
a

b

c

</div>

è quello che accade quando cambi via script il className ai singoli elementi, infatti se dopo averlo fatto richiami un alert di quel className questo risulterà cambiato

sempre per rimuovere i dubbi sulla questione:
perchè se attribuisco colore o sfondo via script lo prende e se cambio il className no?
perchè stai generando una situazione del genere

<style type="text/css">
#livello a{color:#00f;}
.nuova_classe {color:#0f0;}
</style>
<div id="livello">
a

b

c

</div>

che chiaramente da gli effetti sperati

se vuoi continuare a tenere l' id come selettore l' unica potrebbe essere usare l' oggetto stylesheet che ti permette di ridefinire le singole regole all' interno di un foglio di stile

x es.

<html>
<head>
<style type="text/css">
#livello a{color:#00f;}
.nuova_classe {color:#0f0;}
</style>
<script type="text/javascript">
function cambia(){
  if(document.styleSheets) {
    var ie=(document.all)?1:0;
    var stile=(ie)?document.styleSheets[0].rules:document.styleSheets[0].cssRules;
    stile[0].style.color="#f00";
// oppure, x cambiare i valori di + proprietà contemporaneamente, usare un with
//      with(stile[0].style){
//        color="#f00";
//        backgroundColor="#e8e8e8";
//      }
  }
  else alert("il browser in uso non supporta l' oggetto stylesheet");
}
</script>
</head>
<body>
<div id="livello">
a

b

c

</div>
cambia()
</body>
</html>

ciao

[Lollys]

Ah .......adesso ho capito!

Credevo che javascript eliminasse la classe del div, invece la mantiene!!

Ok tutto chiaro.
Sapevo della possibilita di cambiare totalmente lo style ma ho notato che non è compatibille con tutti i browser!

Beh vedremo.