Javascript

[BMercer]

Salve a tutti, ho una domanda che mi attanaglia:
Ho tutta una serie di div con id "box" e vorrei che con un evento javascipt del tipo omouseover la sua classe cambiasse da "red" (predefinita) a "white"; e una volta fatto ciò, quando l'evento onmouseout si verifica, il procedimento si avvii inversamente.
Allora scriviamo:

Codice: Seleziona tutto

function whiteBox() {;
	document.getElementById('box').className = 'white';
}

function redBox() {
	document.getElementById('box').className = 'red';
}

Il problema è però questo: I div sono molti e hanno lo stesso id, quindi è ovvio che appena passo sopra ad uno di questi, tutti i div "box" cambino la loro classe. C'è un sistema per fare in modo che solo all'elemento su cui il mouse passa sopra cambi la sua classe?

[Carlo]

Non essendo esperto in JavaScript, non credo. Perchè non dare diversi id, e poi fare una cosa del genere:

Codice: Seleziona tutto

function redBox(id) {
   document.getElementById(id).className = 'red';
}

E quindi poi alla funzione passi anche l'ID dell'elemento?

[BMercer]

Non essendo esperto in JavaScript, non credo. Perchè non dare diversi id, e poi fare una cosa del genere:

Codice: Seleziona tutto

function redBox(id) {
   document.getElementById(id).className = 'red';
}

E quindi poi alla funzione passi anche l'ID dell'elemento?

Si avevo pensato anche io a qualcosa del genere, magari inserendo come id qualcosa come "box1", "box2".
Come potrei fare? E' come in php che si lega con il punto? così:

Codice: Seleziona tutto

function redBox(number) {
   document.getElementById('box'.number).className = 'red';
}

??

[Carlo]

No, in JavaScript se non sbaglio si mette una + (più).