10
Por ejemplopara cada tipo de elemento en el cuerpo
For each div in body
div.innerHtml = "poo"
next div
esto es, obviamente, pseudo código, pero demuestra lo que estoy tratando de hacer.
A
Respuesta
23
var elements = document.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
Si desea buscar sólo en el <body>:
var elements = document.body.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
+1
'document.getElementsByTagName ('cuerpo') [0] === document.body';) –
+2
@amnotiam. Sí, eso fue estúpido ... :) gracias. – 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 versión alterna con el nuevo método Array.from() y arrow functions en 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>Si el tamaño es absolutamente crucial para usted, entonces esta solución es sólo 84 bytes, en comparación con 113 para la respuesta de @Roko y 120 para @ gdoron's.
En ese caso, podría acortar este jQuery mucho más:
$("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>Ahora sólo 26 bytes!
+0
Interesantes ejemplos, pero no se puede hablar sobre * size * y jQuery porque es una biblioteca sobre JS y * tiene su tamaño * por sí mismo. Pulgares arriba para la versión JS BTW (aunque usaría querySelectorAll;) –
2
Trabajo fácil:
NodeList.prototype.forEach = HTMLCollection.prototype.forEach = Array.prototype.forEach;
Y ahora:
// 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)
})
Cuestiones relacionadas
- 1. ¿Deberían establecerse estilos de CSS globales en el elemento html o en el elemento de cuerpo?
- 2. Aplicar el método para cada elemento en la matriz/enumerables
- 3. Elemento de molde en Java para cada instrucción
- 4. altura diferente para cada elemento de GridView
- 5. Obtenga cada enésimo elemento en el conjunto
- 6. android listview diferentes vistas para cada elemento
- 7. Cambiar el tipo de cuerpo a JSON mediante HTTParty
- 8. No getElementById para el cuerpo?
- 9. ¿Por qué no hay una función para cada miembro para cada tipo de colección en stl?
- 10. C#: Alteración de valores para cada elemento en una matriz
- 11. Proporcionar un cuerpo de función diferente para una función genérica basada en el tipo
- 12. longitud Matlab de cada elemento en el arreglo de celdas
- 13. C# - Obtenga el tipo de elemento para una lista genérica
- 14. cómo hacer animación de traducción para cada elemento listview
- 15. MsBuild ejecuta Exec para cada elemento en una lista
- 16. ¿Utilizar loops para obtener cada elemento en un ListView?
- 17. Información sobre herramientas para cada elemento en un cuadro combinado
- 18. usando BeautifulSoup para insertar un elemento antes de cerrar el cuerpo
- 19. El uso de un DisplayTemplate (con DisplayFor) para cada elemento de una colección
- 20. Fundido en cada elemento - uno tras otro
- 21. ¿Cómo establecer el flotante para cada elemento dentro de un div a la vez sin especificar el flotante para cada elemento dentro?
- 22. ¿Cómo centrar el cuerpo en una página?
- 23. verificar el tipo de elemento en el contenedor stl - C++
- 24. JS/jQuery - obtener el tipo de elemento
- 25. Seleccione cada enésimo elemento en jQuery?
- 26. obtener matriz de claves para cada elemento bajo JSONArray
- 27. CSS cuerpo y elemento de 100% de altura
- 28. ¿Cómo eliminar el margen de cada elemento que es el último elemento de una fila?
- 29. PHP Implode Pero envolver cada en el elemento Cotizaciones
- 30. ¿Cómo uso la reflexión para determinar el tipo anidado (tipo de elemento) de una matriz?
contesté su pregunta, pero usted debe hacer la tarea primera ... – gdoron