2013-08-27 12 views
8

Ho molti div con la classe publish_0 che vorrei passare a publish_1 con un clic di un pulsante.javascript setattribute a più elementi

In questo momento lo uso ma cambia solo un elemento.

Come applicare l'attributo set a tutti gli articoli che dispongono di publish_0.

document.querySelector('.publish_0').setAttribute("class", "publish_1"); 

risposta

3

È possibile utilizzare questo con jQuery:

$(".publish_0").attr("class", "publish_1") 

In alternativa, usa getElementsByClassName e passa in rassegna gli elementi DOM restituiti.

22

È necessario utilizzare un ciclo per iterare su tutti gli elementi e impostare il valore attributo class singolarmente:

var els = document.querySelectorAll('.publish_0'); 
for (var i=0; i < els.length; i++) { 
    els[i].setAttribute("class", "publish_1"); 
} 
+0

querySelectorAll – bfavaretto

+0

@bfavaretto Grazie. Questo è quello che succede quando copiate e incollate il codice dell'OP. –

+0

Ci sono stato più volte di quanto vorrei ammettere. – bfavaretto

3

Per quando non è possibile utilizzare jQuery ma si desidera la comodità di qualcosa di simile, è possibile effettuare le seguenti operazioni. Aggiungi il seguente codice all'inizio del file o da qualche altra parte facilmente visibile.

NodeList.prototype.forEach = NodeList.prototype.forEach || Array.prototype.forEach; 

Ora nel codice si può fare questo:

document.querySelectorAll('body,main,article,[class*=content],[class*=center]') 
     .forEach((function(x){ x.setAttribute("style","width:1920px");})) 

O ancora più bello ancora, se il browser supporta ECMAScript2015 è possibile utilizzare la sintassi freccia:

document.querySelectorAll('[class*=content]') 
     .forEach(x=> x.setAttribute("style","width:1200px")) 

si può mettere la dichiarazione tutto su una riga se desideri.