10
Per esempioper ogni tipo di elemento nel corpo
For each div in body
div.innerHtml = "poo"
next div
Si tratta ovviamente di codice pseudo ma dimostra quello che sto cercando di fare.
A
risposta
23
var elements = document.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
Se si vuole guardare solo nel <body>:
var elements = document.body.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
+1
'document.getElementsByTagName ('body') [0] === document.body';) –
+2
@amnotiam. Sì, è stato stupido ... :) grazie. – gdoron
15
let elements= document.querySelectorAll('div');
Array.from(elements).forEach((el) => {
el.innerHTML = "foo";
});
Array.from()MDN
Document.querySelectorAll()
var elements= document.querySelectorAll('div');
[].forEach.call(elements, function(el) {
el.innerHTML = "foo";
});
var elements= document.getElementsByTagName('div');
for (var i=0; i<elements.length; i++) {
elements[i].innerHTML = "foo";
}
1
Una versione alternativa con il nuovo metodo Array.from() e arrow functions in ES2015:
Array.from(document.body.getElementsByTagName("div")).forEach(a=>a.innerHTML='foo');<div></div>
<div></div>
<div>Test</div>
<div></div>
<div>Hello</div>
<div>World</div>Se la dimensione è assolutamente cruciale per voi, allora questa soluzione è solo 84 byte, rispetto al 113 per @ risposta di Roko e 120 per @ gdoron's.
In tal caso, jQuery potrebbe ridurre questo di gran lunga più:
$("body div").html('foo');<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
<div></div>
<div>Test</div>
<div></div>
<div>Hello</div>
<div>World</div>Ora solo 26 byte!
+0
Esempi interessanti, ma non si può parlare di * size * e jQuery perché è una libreria su JS e * ha la sua dimensione * su se stessa. Complimenti per la versione JS di BT (anche se userei querySelectorAll;) –
2
lavoro facile:
NodeList.prototype.forEach = HTMLCollection.prototype.forEach = Array.prototype.forEach;
E ora:
// VanillaJS/JavaScript puro
var lista_de_divs = document.querySelectorAll('div')
lista_de_divs.forEach(function (div, i) {
// código...
console.log(i, div)
})
// jQuery
$('div').forEach(function (div, i) {
// código...
console.log(i, div)
})
Problemi correlati
- 1. Cosa significa `corpo! = Corpo` nel modello di giada?
- 2. Spring MVC: Come restituire un diverso tipo nel corpo ResponseEntity
- 3. " ..1" nel corpo di '[[.data.frame'
- 4. Meta tag nel corpo
- 5. * ngPer la variabile locale per ogni elemento
- 6. Loop per ogni elemento in un elenco
- 7. diversa altezza per ogni elemento in GridView
- 8. Dividere uno spazio ugualmente per ogni elemento
- 9. Il contenuto del tipo di elemento "..." deve corrispondere nel web.xml
- 10. Come applicare i CSS per elemento del corpo HTML?
- 11. Python "Ogni altro elemento" Idiom
- 12. JQuery: leggere ogni riga di un elemento
- 13. Stile corpo elemento a schermo intero?
- 14. Rimozione di ogni altro elemento in NumPy
- 15. Append elemento superiore del corpo in jQuery
- 16. C#: modifica dei valori per ogni elemento di un array
- 17. ottieni un array di KEY per ogni elemento sotto jsonarray
- 18. addEventHandler a ogni elemento di una classe
- 19. Ottenere ogni ennesimo elemento di una sequenza
- 20. Convertire un vettore R in una lista, ogni elemento nel vettore come un elemento della lista
- 21. Ottieni ogni ennesimo elemento nell'array
- 22. RxJava - recupera ogni elemento nell'elenco
- 23. Confronto di ogni elemento con ogni altro elemento in una lista
- 24. Get ultimo elemento di ogni lista
- 25. Django template {% per%} tag Add li ogni 4 elemento
- 26. ID applicazione problema per ogni tipo di applicazione client
- 27. Entità delle dichiarazioni nel corpo di una dichiarazione di ritiro
- 28. Selettore Jquery per tipo di elemento e nome classe?
- 29. Symfony/Doctrine/MongoDB Ottieni ogni ennesimo elemento
- 30. MongoDB liste - ottenere ogni elemento Nth
ho risposto alla tua domanda, ma si dovrebbe fare i compiti prima ... – gdoron