Vínculos>>Tablas de contenido
Ahora que ya hemos visto lo que son los vínculos o enlaces internos vamos a ver una utilidad similar a algo que tal vez hayas utilizado a en un procesador de texto. Se trata de crear un índice paginado cuando tienes un documento muy extenso y pretendes facilitar el acceso a los diferentes apartados.
En un documento HTML podemos hacer algo similar, aunque al no representarse sobre un medio paginado como el papel no podremos numerar las páginas, ya que la pantalla de cada monitor puede contener una cantidad diferente de información según su tamaño y resolución. En lugar de utilizar un número de página se creará un listado de enlaces activos para que al pulsar sobre ellos se pueda acudir a cada epígrafe.
En la práctica se trata de un caso especial de enlace interno que se creará y se de forma automática cuando lo solicitemos.
El único requisito
importante es que tengamos estructurado el texto para que la rutina de
creación de tablas de contenido pueda ejecutarse. Para ello,
lo más habitual es que tengamos etiquetadas los
títulos de cada epígrafe con cabeceras
h1
,
h2
, etc. Una vez cumplida esta
condición el procedimiento es tan sencillo como
h3
a
las que le hemos aplicado la clase titulillo pero que no se mostraran
en la tabla de contenidos las h3
que
no llevaran esa clase.<p>
y <div>
podríamos combinarlas con una clase específica para ir
creando la tabla de contenidos, aunque realmente es más
trabajoso que utlizar las etiquetas de cabeceras h1...h6
con las que no necesitamos crear clases especiales.<ol id="mozToc">
<!--mozToc h1 1 h2 2 h3 3 h4 4 h5 5 h6 6-->
<li><a
href="#mozTocId558864">Título de apartado
principal</a>
<ol>
<li><a
href="#mozTocId437177">Título de
subapartado</a></li>
<li><a
href="#mozTocId5443">Título de subapartado
</a></li>
<li><a
href="#mozTocId75336">Título de subapartado
</a></li>
</ol>
<li><a
href="#mozTocId68364">Título de apartado
principal</a>
</ol>
Como ves ha iniciado una lista numerada, la ha identificado, pone un comentario para indicar que tipo de cabecera ocupará cada nivel y, luego va insertando elementos de la lista y anidándolos según el tipo de cabecera que lleven para que se sitúen en el nivel que les corresponde.
Lógicamente este proceso va acompañado de la inserción delante de cada una de las cabeceras de un ancla con el nombre, generado aleatoriamente, que se utiliza en la tabla de contenidos.<a class="mozTocH2"
name="mozTocId5443"></a>
id="mozToc"
que ha puesto el
programa en la etiqueta de inicio de la tabla de contenidos es un
identificador que sirve perfectamente para esa función. Por
otra parte recuerda que, dado todos
los enlaces de vuelta atrás apuntan al mismo lugar puedes
crear el primero, copiarlo, e irlo pegando en cada uno de los sitios en
los que deba aparecer.