En esta parte del tutorial veremos como utilizar el método getElementsByClassName() para acceder a los elementos del DOM HTML a través de su atributo class.
Al igual que ocurre con los métodos getElementsByName() o getElementsByTagName() este método obtiene un array con la lista de elementos a los que podremos acceder indivualmente de forma indexada.
Código del ejemplo del capítulo ...
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function()
{
var btn = document.getElementById("btn");
btn.onclick = function()
{
var clase = document.getElementsByClassName("clase");
for (x=0; x<clase.length; x++)
{
clase[x].style.backgroundColor = "green";
clase[x].style.color = "white";
}
}
}
</script>
</head>
<body>
<div class="clase">Hola mundo</div>
<span class="clase">getElementsByClassName</span>
<strong class="clase">Aprendiendo javascript</strong>
<button id="btn" type="button">Cambiar estilos CSS</button>
</body>
</html>
No hay comentarios:
Publicar un comentario