HTML DOM Nodos
En el código HTML DOM (Document Object Model) , todo es un nodo:
- El documento en sí es un nodo de documento
- Todos los elementos HTML son nodos de elemento
- Todos los atributos HTML son nodos de atributos
- El texto dentro de los elementos HTML son los nodos de texto
- Los comentarios son nodos de comentario
El Document Object
Cuando un documento HTML se carga en un navegador web, se convierte en un objeto de documento.
El objeto del documento es el nodo raíz del documento HTML y el "owner" de todos los otros nodos:
(Nodos de elementos, los nodos de texto, atribuyen los nodos, y los nodos de comentario).
El objeto documento proporciona propiedades y métodos para acceder a todos los objetos de nodo, desde el interior de JavaScript.
Tip: El documento es una parte del objeto de la ventana y se puede acceder como window.document.
Soporte del navegador
| Objeto | |||||
|---|---|---|---|---|---|
| Document | Sí | Sí | Sí | Sí | Sí |
El objeto del documento es compatible con todos los principales navegadores.
Propiedades y métodos objeto de documento
Las siguientes propiedades y métodos se pueden utilizar en los documentos HTML:
| Propiedad / Método | Descripción |
|---|---|
| document.activeElement | Devuelve el elemento enfocado actualmente en el documento |
| documento. addEventListener() | Se conecta un controlador de eventos para el documento |
| documento. adoptNode() | Adopta un nodo de otro documento |
| document.anchors | Devuelve una colección de todos los <a> elementos del documento que tienen un atributo de nombre |
| document.applets | Devuelve una colección de todos los <applet> elementos en el documento |
| document.baseURI | Devuelve el URI de base absoluta de un documento |
| document.body | Establece o devuelve el cuerpo del documento (the <body> element) |
| documento. close() | Cierra el flujo de salida previamente abierta con el documento. open() |
| document.cookie | Devuelve todos los pares de nombre / valor de cookies en el documento |
| documento. createAttribute() | Crea un nodo de atributo |
| documento. createComment() | Crea un nodo de comentario con el texto especificado |
| documento. createDocumentFragment() | Crea un nodo DocumentFragment vacía |
| documento. createElement() | Crea un nodo de elemento |
| documento. createTextNode() | Crea un nodo de texto |
| document.doctype | Devuelve la Declaración de tipo de documento asociado con el documento |
| document.documentElement | Devuelve el elemento de documento del documento (the <html> element) |
| document.documentMode | Devuelve el modo utilizado por el navegador muestre el documento |
| document.documentURI | Establece o devuelve la ubicación del documento |
| document.domain | Devuelve el nombre de dominio del servidor que ha cargado el documento |
| document.domConfig | Obsoleto. Devuelve la configuración DOM del documento |
| document.embeds | Devuelve una colección de todos los <embed> elementos del documento |
| document.forms | Devuelve una colección de todos los <form> elementos en el documento |
| documento. getElementById() | Devuelve el elemento que tiene el ID atributo con el valor especificado |
| documento. getElementsByClassName() | Devuelve un NodeList que contiene todos los elementos con el nombre de la clase especificada |
| documento. getElementsByName() | Devuelve un NodeList que contiene todos los elementos con un nombre especificado |
| documento. getElementsByTagName() | Devuelve un NodeList que contiene todos los elementos con el nombre de la etiqueta especificada |
| documento. hasFocus() | Devuelve un valor booleano que indica si el documento tiene el foco |
| document.head | Devuelve el <head> elemento del documento |
| document.images | Devuelve una colección de todos los <img> elementos en el documento |
| document.implementation | Devuelve el objeto DOMImplementation que se encarga de este documento |
| documento. importNode() | Importa un nodo de otro documento |
| document.inputEncoding | Devuelve la codificación, juego de caracteres, que se utiliza para el documento |
| document.lastModified | Devuelve la fecha y hora de la última modificación del documento |
| document.links | Devuelve una colección de todos los <a> y <area> elementos en el documento que tienen un atributo href |
| documento. normalize() | Elimina los nodos de texto vacío, y se une a los nodos adyacentes |
| documento. normalizeDocument() | Elimina los nodos de texto vacío, y se une a los nodos adyacentes |
| documento. open() | Abre un flujo de salida HTML para recoger salida del documento. write() |
| documento. querySelector() | Devuelve el primer elemento que coincide con un CSS especificado selector(s) en el documento |
| documento. querySelectorAll() | Devuelve un NodeList estática que contiene todos los elementos que coincide con un CSS especificado selector(s) en el documento |
| document.readyState | Devuelve el (loading) estado del documento |
| document.referrer | Devuelve la URL del documento que ha cargado el documento actual |
| documento. removeEventListener() | Elimina un controlador de eventos a partir del documento (que se ha unido con el addEventListener() método) |
| documento. renameNode() | Cambia el nombre del nodo especificado |
| document.scripts | Devuelve una colección de <script> elementos en el documento |
| document.strictErrorChecking | Establece o devuelve si la comprobación de errores se hace cumplir o no |
| titulo del documento | Establece o devuelve el título del documento |
| document.URL | Devuelve la URL completa del documento HTML |
| documento. write() | Escribe expresiones código HTML o Javascript para un documento |
| documento. writeln() | Igual que write() , pero añade un carácter de nueva línea después de cada declaración |
Advertencia !!!
En el W3C DOM Core, el objeto del documento hereda todas las propiedades y métodos desde el objeto Node.
Muchas de estas propiedades y métodos no tienen sentido utilizado en documentos.
Evitar el uso de estas propiedades de los objetos de nodo y métodos sobre los objetos de documento HTML:
| Propiedad / Método | Razón para evitar |
|---|---|
| document.attributes | Los documentos no tienen atributos |
| documento. hasAttributes() | Los documentos no tienen atributos |
| document.nextSibling | Los documentos no tienen hermanos |
| document.nodeName | Esto es siempre #document |
| document.nodeType | Esto es siempre 9 (DOCUMENT_NODE) |
| document.nodeValue | Los documentos no tienen un valor de nodo |
| document.ownerDocument | Los documentos carecen de un documento de propietario |
| document.ownerElement | Los documentos carecen de un elemento propietario |
| document.parentNode | Los documentos no tienen un nodo padre |
| document.previousSibling | Los documentos no tienen hermanos |
| document.textContent | Los documentos no tienen un contenido de texto |