Esquema desplegable

El script Como funciona
<!-- Mas en: http://javascript.espaciolatino.com/ -->

<script language="JavaScript">
function cambiaEstado(iden)
{
var elhtml = document.getElementById(iden);
if (elhtml.style.display == 'block')
     elhtml.style.display = 'none';
else
     elhtml.style.display = 'block';
}
< /script>

Se trata de un script tan simple que apenas necesita comentarios. La función recibe como argumentos un identificador (iden), y busca el elemento HTML cuyo ID sea igual a este valor, para ello usa el método getElementById( ). Una vez encontrado el elemento tan sólo modifica su propiedad display: si está en mostrar (block) lo pone en ocultar (none) y viceversa.
Quizás lo más interesante de este script sea que usa código standard, es decir destinado a navegadores que cumplen con los standares de la W3C, que en lo que afecta al DHTML es la normativa del DOM1 y el HTML4. Por tanto este script debe funcionar en Netscape 6 y en MSIE 6, de hecho funciona apartir de MSIE 5, que sólo cumple la regulación DOM1 en un 86%.
La página Como se usa
 <body>
< ul>
< li><a href="javascript:cambiaEstado('e1')">entrada 1</a>
< ul id="e1" class="nivel1">
< li>apartado 1 de entrada 1</li>
< li>apartado 2 de entrada 1</li>
< /ul>
< /li>
< li><a href="javascript:cambiaEstado('e2')">entrada 2</a>
< ul id="e2" class="nivel1">
< li>apartado 1 de entrada 2</li>
< li>apartado 2 de entrada 2 </li>
< /ul>
< /li>
< /ul>
< /body>
 Como vemos en lugar de usar el evento onclick se usa como enlace una llamada a la función cambiaEstado( ). El argumento de la llamada es el ID del bloque UL de la lista. Simple.
   
     
Envía esta página a un amigo. Te lo agradecerá.   Poner esta página como página de inicio