10 - Accediendo a un conjunto de marcas HTML similares a partir de un Nodo (getElementsByTagName)



Problema:Confeccionar una página que muestre dos div que contengan 3 párrafos cada uno. Cuando se presione un botón ocultar todos los párrafos del segundo div.
<!DOCTYPE html>
<html>
<head>
<title>Problema</title>
<script src="funciones.js"></script>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<div id="bloque1">
<h1>Primer Bloque de párrafos.</h1>
<p>Este es el primer párrafo</p>
<p>Este es el segundo párrafo</p>
<p>Este es el tercer párrafo</p>
</div>
<div id="bloque2">
<h1>Segundo Bloque de párrafos.</h1>
<p>Este es el primer párrafo</p>
<p>Este es el segundo párrafo</p>
<p>Este es el tercer párrafo</p>
</div>
<input type="button" value="Ocultar" onClick="ocultarParrafos()">
</body>
</html>
function ocultarParrafos()
{
  var obj=document.getElementById("bloque2");
  var lista=obj.getElementsByTagName('p');
  for(f=0;f<lista.length;f++)
  {
   lista[f].style.display='none';
  }
}
Ver solución


Retornar