JavaScript HTML DOM Documento

El objeto de documento DOM HTML es el propietario de todos los otros objetos en su página web.

Objeto Documento DOM HTML

El objeto de documento representa su página web.

Si desea acceder a cualquier elemento de la página HTML, siempre debe comenzar por acceder al objeto document.

A continuación, se presentan algunos ejemplos de cómo usar el objeto document para acceder y operar con HTML.

Buscar elementos HTML

Método Descripción
document.getElementById(id) Buscar elementos por id del elemento
document.getElementsByTagName(name) Buscar elementos por nombre de etiqueta
document.getElementsByClassName(name) Buscar elementos por nombre de clase

Cambiar el elemento HTML

Método Descripción
element.innerHTML = nuevo contenido HTML Cambiar el inner HTML del elemento
elemento.attribute = new value Cambiar el valor del atributo del elemento HTML
elemento.setAttribute(atributo, value) Cambiar el valor del atributo del elemento HTML
elemento.style.property = new style Cambiar el estilo del elemento HTML

Agregar y eliminar elementos

Método Descripción
document.createElement(elemento) Crear elemento HTML
document.removeChild(elemento) Eliminar elemento HTML
document.appendChild(elemento) Agregar elemento HTML
document.replaceChild(elemento) Reemplazar elementos HTML
document.write(text) Escribe en el flujo de salida HTML

Agregar administrador de eventos

Método Descripción
document.getElementById(id).onclick = function(){code} Agregar un administrador de eventos a eventos onclick

Buscar objetos HTML

Primera versión HTML DOM Level 1 (1998), que definió 11 objetos, colecciones de objetos y atributos de HTML. Estos aún son válidos en HTML5.

Más tarde, en HTML DOM Level 3, se añadieron más objetos, colecciones y atributos.

Atributos Descripción DOM
document.anchors Devuelve todos los elementos <a> que tienen la propiedad name. 1
document.applets Devuelve todos los elementos <applet>(No recomendado en HTML5) 1
document.baseURI Devuelve la URI de referencia absoluta del documento 3
document.body Devuelve el elemento <body> 1
document.cookie Devuelve las cookies del documento 1
document.doctype Devuelve el doctype del documento 3
document.documentElement Devuelve el elemento <html> 3
document.documentMode Devuelve el modo utilizado por el navegador 3
document.documentURI Devuelve la URI del documento 3
document.domain Devuelve el nombre de dominio del servidor de documento 1
document.domConfig Abandonado.Devuelve la configuración DOM 3
document.embeds Devuelve todos los elementos <embed> 3
document.forms Devuelve todos los elementos <form> 1
document.head Devuelve el elemento <head> 3
document.images Devuelve todos los elementos <img> 1
document.implementation Devuelve la implementación DOM 3
document.inputEncoding Devuelve la codificación (conjunto de caracteres) del documento 3
document.lastModified Devuelve la fecha y hora de actualización del documento 3
document.links Devuelve todos los elementos <area> y <a> con atributo href 1
document.readyState Devuelve el estado (cargado) del documento 3
document.referrer Devuelve el URI referenciado (documento enlazado) 1
document.scripts Devuelve todos los elementos <script> 3
document.strictErrorChecking Devuelve si se debe ejecutar la verificación de errores 3
document.title Devuelve el elemento <title> 1
document.URL Devuelve la URL completa del documento 1