JavaScript: el DOM heredado

Este es el modelo que se introdujo en las primeras versiones del lenguaje JavaScript. Es compatible con todos los navegadores, pero permite el acceso solo a determinadas partes clave de los documentos, como formularios, elementos de formulario e imágenes.

Este modelo proporciona varias propiedades de solo lectura, como título, URL y lastModified, proporciona información sobre el documento en su conjunto. Aparte de eso, hay varios métodos proporcionados por este modelo que se pueden usar para establecer y obtener valores de propiedad del documento.

Propiedades del documento en DOM heredado

A continuación se muestra una lista de las propiedades del documento a las que se puede acceder mediante DOM heredado.

No Señor.	Descripción de propiedad
1	alinkColor En desuso: una cadena que especifica el color de los enlaces activados. Ex - document.alinkColor
2	anchors[ ] Una matriz de objetos Anchor, uno para cada ancla que aparece en el documento. Ex - document.anchors [0], document.anchors [1] y así sucesivamente
3	applets[ ] Una matriz de objetos Applet, uno para cada applet que aparece en el documento. Ex - document.applets [0], document.applets [1] y así sucesivamente
4	bgColor En desuso: una cadena que especifica el color de fondo del documento. Ex - document.bgColor
5	cookie Una propiedad con valor de cadena con un comportamiento especial que permite consultar y configurar las cookies asociadas con este documento. Ex - document.cookie
6	domain Una cadena que especifica el dominio de Internet del que proviene el documento. Se utiliza con fines de seguridad. Ex - documento.dominio
7	embeds[ ] Matriz de objetos que representan datos incrustados en el documento con la etiqueta <embed>. Un sinónimo de complementos []. Algunos complementos y controles ActiveX se pueden controlar con código JavaScript. Ex - document.embeds [0], document.embeds [1] y así sucesivamente
8	fgColor En desuso: una cadena que especifica el color de texto predeterminado para el documento. Ex - document.fgColor
9	forms[ ] Una matriz de objetos de formulario, uno para cada formulario HTML que aparece en el documento. Ex - document.forms [0], document.forms [1] y así sucesivamente
10	images[ ] Una matriz de objetos de imagen, uno para cada imagen incrustada en el documento con la etiqueta HTML <img> Ex - document.images [0], document.images [1] y así sucesivamente
11	lastModified Una cadena de solo lectura que especifica la fecha del cambio más reciente en el documento. Ex - document.lastModified
12	linkColor En desuso: una cadena que especifica el color de los enlaces no visitados. Ex - document.linkColor
13	links[ ] Es una matriz de enlaces de documentos. Ex - document.links [0], document.links [1] y así sucesivamente
14	location La URL del documento. En desuso en favor de la propiedad URL. Ex - document.location
15	plugins[ ] Un sinónimo de incrustaciones [] Ex - document.plugins [0], document.plugins [1] y así sucesivamente
dieciséis	Referrer Una cadena de solo lectura que contiene la URL del documento, si lo hubiera, desde el que se vinculó el documento actual. Ex - document.referrer
17	Title El contenido de texto de la etiqueta <title>. Ex - document.title
18	URL Una cadena de solo lectura que especifica la URL del documento. Ex - document.URL
19	vlinkColor En desuso: una cadena que especifica el color de los enlaces visitados. Ex - document.vlinkColor

Métodos de documento en DOM heredado

A continuación, se muestra una lista de métodos admitidos por DOM heredado.

No Señor.	Descripción de propiedad
1	clear( ) En desuso: borra el contenido del documento y no devuelve nada. Ex - document.clear ()
2	close( ) Cierra un flujo de documentos abierto con el método open () y no devuelve nada. Ex - document.close ()
3	open( ) Elimina el contenido del documento existente y abre una secuencia en la que se puede escribir el contenido del nuevo documento. No devuelve nada. Ex - document.open ()
4	write( value, ...) Inserta la cadena o cadenas especificadas en el documento que se está analizando actualmente o las agrega al documento abierto con open (). No devuelve nada. Ex - document.write (valor, ...)
5	writeln( value, ...) Idéntico a write (), excepto que agrega un carácter de nueva línea a la salida. No devuelve nada. Ex - document.writeln (valor, ...)

Ejemplo

Podemos ubicar cualquier elemento HTML dentro de cualquier documento HTML usando HTML DOM. Por ejemplo, si un documento web contiene unform luego, usando JavaScript, podemos referirnos a él como document.forms[0]. Si su documento web incluye dosform elementos, el primer formulario se conoce como document.forms [0] y el segundo document.forms [1].

Usando la jerarquía y las propiedades dadas anteriormente, podemos acceder al primer elemento del formulario usando document.forms[0].elements[0] y así.

A continuación, se muestra un ejemplo para acceder a las propiedades del documento mediante el método DOM heredado.

<html>
   
   <head>
      <title> Document Title </title>
      
      <script type = "text/javascript">
         <!--
            function myFunc() {
               var ret = document.title;
               alert("Document Title : " + ret );
            
               var ret = document.URL;
               alert("Document URL : " + ret );
            
               var ret = document.forms[0];
               alert("Document First Form : " + ret );
            
               var ret = document.forms[0].elements[1];
               alert("Second element : " + ret );
            }
         //-->
      </script>
      
   </head>
   
   <body>
      <h1 id = "title">This is main title</h1>
      <p>Click the following to see the result:</p>
      
      <form name = "FirstForm">
         <input type = "button" value = "Click Me" onclick = "myFunc();" />
         <input type = "button" value="Cancel">
      </form>
      
      <form name = "SecondForm">
         <input type = "button" value = "Don't ClickMe"/>
      </form>
      
   </body>
</html>

Salida

NOTE - Este ejemplo devuelve objetos para formularios y elementos y tendríamos que acceder a sus valores utilizando esas propiedades de objeto que no se tratan en este tutorial.

↰ Previous page