[javascript] modificare colore

[keyg]

vorrei modificare il colore del testo all'interno della pagina...

i passaggi sono:
-trova gli elementi della pagina(codice non riportato..troppo lungo)
-controlla se ci sono elementi
_per ogni elemento mi toglie rimuove quello che c'è all'interno e modifica il colore del testo...

ma c'è qualcosa che non va!..

questo è il codice

.........


//controlla se ci sono elementi nella pagina
if (Elements.length > 0)
{



var element = null;
var styleElem = null;
var textNode = null;
var styleText= "#FF00FF" ;



for (Counter=0; Counter<Elements.length; Counter++)
{





//rimuove elemento

while(element = Elements[Counter].getElementById(id)) {
element.parentNode.removeChild(element);
}




styleElem = Elements[Counter].createElement("style");
styleElem.setAttribute("id", id);
styleElem.setAttribute("type", "text/css");

textNode = Elements[Counter].createTextNode( styleText );

styleElem.appendChild(textNode);


Elements[Counter].documentElement.childNodes[0].appendChild(styleElem);

}
}


....


ho provato in questo modo, ma nulla da fare...
riuscireste a darmi qualche dritta?..
grazie!

[andbin]

Se una variabile elem rappresenta un elemento, allora ad esempio:

elem.style.color = "#FF00FF";

imposta il colore dell'elemento.

[keyg]

...il problema è che alla lista element devo andare a togliere il nodo trovato...e aggiungere al posto di quel nodo un'altro nodo...


ho provato in questo modo...


if (Elements.length > 0)
{

var colTesto = null;
var styleElem = null;
var textNode = null;
var styleText = null;
var color = "#FF00FF";

for (Counter=0; Counter<Elements.length; Counter++)
{


//trova elementi color
styleElem = Elements[Counter].getElementsByTagName('color');

//rimuove elemento dal nodo
styleElem.removeChild(styleElem);

//crea un'altro elemento
styleElem = Elements[Counter].createElement("style");
styleElem.setAttribute("id", id);
styleElem.setAttribute("type", "text/css");

//aggiunge il colore
styleText = "* { color: " + color + " !important; }";

//crea il text nodo
textNode = Elements[Counter].createTextNode( styleText );

//lo aggiunge all'elemento
styleElem.appendChild(textNode);

//modifica la struttura
Elements[Counter].documentElement.appendChild(styleElem);




}



...anche così non va bene!...
qualcuno sa dove posso sbatter la testa?...

grazie per l'aiuto!..

[vladix]

puoi semlicemente fare con

node.replaceChild(novoDaRimuovere , nuovoNodo);


ma non capisco ... tu stai cercando di creare na classe di stile con il pezzo di codice che hai postato ? xche se cosi fose , stai ben lontano dal realizzarla

stai sbagliando gia dalla prima riga

Elements[Counter].getElementsByTagName('color')
ritorna un array quindi gli devi dire l'elemento su quale elemento deve operare ( anche se contiene un solo elemento , ritorna sempre un array quindi te lo devi prendere cosi document.getElementsByTagName('color')[0];
e poi qui

styleElem.removeChild(styleElem);

:eek: stai cercando di togliere il nodo styleElem dal nodo ... styleElem , e suppongo che tu abbia un nodo con il tag "<color>" nella tua pagina se no
".getElementsByTagName('color')" non ti trova niente , e se c'e l'hai sei un po fuori strada ... invecce di scorerti tutti gli elementi della pagina scorri solo gli elementi trovati ,


for(i = 0; i < document.getElementsByTagName('color').length; i++){
var xd = document.getElementsByTagName('color')[i];
xd.parentNode.replace(xd , nuovoNodo);
}


cmq ti consiglio di legerti una guida dom (http://javascript.html.it/guide/leggi/24/guida-dom/) x fa sta cosa
PS: vorrei sapere xche gli dai un id al elemento style ... a cosa serve

[keyg]

...prima di tutto grazie per il consiglio...io stavo seguendo un tutorial in inglese e non ci stavo capendo molto!...

quello che voglio fare...è prendere il colore del testo di alcune elementi all'interno della pagina e modificarglielo...

io ho un array "Elements" con all'interno gli elementi della pagina

quindi:

//controllo che ci siano deli elementi all'interno della pagina

if (Elements.length > 0)
{

//scorro tutti gli elementi

for (Counter=0; Counter<Elements.length; Counter++)
{

in teoria adesso vorrei modificare il colore del testo deli elementi trovati, quindi...quello che mi era venuto in mente era questo

rimuovo l'elemento trovato..e ne rimetto un altro uguale modificandogli il colore

quindi da quello che mi hai spiegato(se non ho capito male!)..dovrei aggiungere..

for(i = 0; i < Elements[Counter].getElementsByTagName('color').length; i++)

{
var xd = Elements[Counter].getElementsByTagName('color')[i];
xd.parentNode.replaceChild(xd , nuovoNodo);
nuovoNodo.style.color="#FF00FF";


}


}
}



grazie per l'aiuto!

[vladix]

ma scusa , se a te serve solo cambiare il colore , basta che risetti il colore ( come ha detto gia andbin )


for(i = 0; i < Elements[Counter].getElementsByTagName('color').length; i++){
var xd = Elements[Counter].getElementsByTagName('color')[i];
xd.style.color="#FF00FF";
}

[keyg]

così..ho già provato...

ma mi da questo errore...

"Errore: uncaught exception: Permesso negato al metodo di chiamata Location.toString"..

è quindi non so che pesci prendere!..

[vladix]

strano , metti un po di alert qua e la , vedi se Element e vuoto , e sopratutto vedi che ti ritorna
ma ora che ci penso ... tu hai elementi in pagina col tag <color> ?

qui un pezzo di codice ( che funziona benissimo ) di esempio ...

<html>
<head>
</head>
<script>
function change(){
var elm = document.getElementsByTagName('span');
elm[0].style.color = "#333399";
}
</script>
<body>
<span style="color:#CC6633">Testo Colorato
</span>
<input type="button" value=":=)" onclick="change();"
</body>
</html>

[keyg]

no no..element non è vuoto..
se io metto queste due righe nel ciclo

colText = Elements[Counter].forecolour.hexcolour;

alert("trovato " + colText);

mi trova tutti i colori del testo esadecimali che ci sono nella pagina..

il problema è che se provo a modificare la pagina in questo modo

colText.style.color = "#FF00FF";

non mi modifica nulla!..
non capisco se devo togliere il nodo e crearne uno nuovo...