JavaScript - Objeto document

El objeto document se construye a partir de la marca BODY del documento HTML que ha cargado el navegador.

Objeto DOCUMENT

Sobre él pueden actuar los eventos: onClick, onDblClick, onKeyDown, onKeyPress, onKeyUp, onMouseDown, onMouseUp.

Resumen de propiedades del objeto document

  • plugins : array de plugins del documento

  • layers : array que contiene las capas del documento

  • images : array que contiene las imágenes cargadas en el documento

  • applets : array que contiene los applets del documento

  • links : array que contiene los enlaces del documento

  • forms : array que contiene los formularios definidos en el documento

  • anchors : array que contiene los puntos de anclaje (anchors) del documento

  • bgColor : color de fondo del bloque body del documento (atributo BGCOLOR de HTML)

  • linkColor : color de los enlaces (atributo LINK de HTML)

  • alinkColor : color de los enlaces activos (atributo ALINK de HTML)

  • vlinkColor : color de los enlaces visitados (atributo VLINK de HTML)

  • fgColor : color por defecto del texto (atributo TEXT de HTML)

  • lastModified : fecha en la que fue modificado el documento por última vez

  • domain : nombre del servidor web del que procede el documento

  • title : título del documento (contenido de la marca TITLE de HTML)

  • URL : URL completa del documento actual

  • referrer : URL del documento a través del cual se cargó el documento actual

Resumen de métodos del objeto document

  • close() : cierra una corriente de datos abierta por el método open y hace que se muestren todos los elementos

  • getSelection() : devuelve una cadena con el texto seleccionado por el usuario

  • handleEvent() : llama a la función encargada de manejar un determinado evento

  • open() : abre una corriente de datos para escribir en el documento (normalmente con los métodos write o writeln)

  • write() : escribe texto a la corriente de datos del documento

  • writeln() : igual que write pero finaliza el texto con un retorno de carro

Ejemplos:

1.- El siguiente ejemplo abre una nueva corriente de datos en un documento y escribe en ella.

function corriente ( )
{
   // abre una corriente de datos
   document.open();

   // envía datos a la corriente
   document.write ("La corriente está abierta");

   // cierra la corriente de datos y visualiza los elementos
   document.close();
}

...

// cuando se pulsa el botón, el documento actual se sustituye
// por los datos que se envían a la corriente de datos
<input type="button" name="Button" value="Button"    onClick="corriente();">

2.- El texto escrito por el método write durante la carga de una página será considerado como una expresión HTML y añadido tanto a la pantalla del navegador como a la estructura de objetos:


<html>
   <body>

      <script>
      document.write ('<h1> Titulo </h1>')';
      document.write ('<p> Esto es un párrafo </p>'');
      ...
      </script>

   </body>
</html>

3.- El siguiente código muestra el nombre (si lo tienen) de todas las imágenes cargadas en el documento:

function imagenes ()
{
   // se almacenan los nombres de las imágenes
   // antes de abrir una nueva corriente de datos
   var imagenes = new Array;
   for (a=0; a<document.images.length; a++)
   {
      imagenes[a]= document.images[a].name;
   }

   // abre una corriente
   document.open();

   for (a=0;a<imagenes.length;a++)
   {
      // muestra el nombre y el índice de cada imagen
      document.write (imagenes[a]+"&nbsp;&nbsp;&nbsp;"+a+"<br>");
   }

   document.close();
}

Siguiente: Objeto location