Document
La interfaz Document
representa cualquier página web cargada en el navegador y sirve como punto de entrada al contenido de la página web, que es el árbol DOM (Document Object Model).
El árbol DOM incluye elementos como <body>
y <table>
, entre muchos otros. Proporciona funcionalidad globalmente al documento, como obtener la URL de la página y crear nuevos elementos en el documento.
La interfaz Document
describe las propiedades y métodos comunes para cualquier tipo de documento. Según el tipo de documento (p. ej., HTML, XML, SVG, etc.), hay disponible una API más grande: los documentos HTML, servidos con el tipo de contenido "text/html"
, también implementan la interfaz HTMLDocument
, mientras que los documentos XML y SVG implementan la interfaz XMLDocument
.
Constructor
Document()
-
Crea un nuevo objeto
Document
.
Propiedades
Esta interfaz también hereda de las interfaces Node
y EventTarget
.
Document.activeElement
Read only-
Devuelve el
Element
actualmente activo. Document.body
-
Devuelve el nodo
<body>
o<frameset>
del documento actual. Document.characterSet
Read only-
Devuelve el conjunto de caracteres que utiliza el documento.
Document.childElementCount
Read only-
Devuelve el número de elementos hijos del documento actual.
Document.children
Read only-
Devuelve los elementos hijos del documento actual.
Document.compatMode
Experimental Read only-
Indica si el documento se representa en modo quirks o strict.
Document.contentType
Experimental Read only-
Devuelve el tipo de contenido del encabezado MIME del documento actual.
Document.currentScript
Read only-
Devuelve el elemento
<script>
cuyo script se está procesando actualmente y no es un módulo de JavaScript. Document.doctype
Read only-
Devuelve la Definición de Tipo de Documento (DTD) del documento actual.
Document.documentElement
Read only-
Devuelve el
Element
que es un hijo directo del documento. Para documentos HTML, normalmente es el objetoHTMLHtmlElement
que representa el elemento<html>
del documento. Document.documentURI
Read only-
Devuelve la ubicación del documento como una cadena.
Document.embeds
Read only-
Devuelve un
HTMLCollection
de los elementos<embed>
incrustados en el documento. Document.firstElementChild
Read only-
Devuelve el primer elemento hijo del documento actual.
Document.fonts
-
Devuelve la interfaz
FontFaceSet
del documento actual. Document.forms
Read only-
Devuelve un
HTMLCollection
de los elementos<form>
del documento. Document.fullscreenElement
Read only-
El elemento que está actualmente en modo de pantalla completa para este documento.
Document.head
Read only-
Devuelve el elemento
<head>
del documento actual. -
Devuelve un valor booleano que indica si la página se considera oculta o no.
Document.images
Read only-
Devuelve un
HTMLCollection
de las imágenes del documento. Document.implementation
Read only-
Devuelve la implementación DOM asociada con el documento actual.
Document.lastElementChild
Read only-
Devuelve el último elemento hijo del documento actual.
Document.links
Read only-
Devuelve un
HTMLCollection
de los hipervínculos del documento. Document.mozSyntheticDocument
No estándar-
Devuelve
true
solo si este documento es sintético, como una imagen independiente, video, archivo de audio o similar. Document.pictureInPictureElement
Read only-
Devuelve el
Element
que se presenta actualmente en modo picture-in-picture en este documento. Document.pictureInPictureEnabled
Read only-
Devuelve
true
si la función picture-in-picture está habilitada. Document.plugins
Read only-
Devuelve un
HTMLCollection
de los complementos disponibles. Document.pointerLockElement
Read only-
Devuelve el conjunto de elementos como destino para los eventos del mouse mientras el puntero está bloqueado.
null
si el bloqueo está pendiente, el puntero está desbloqueado o si el objetivo está en otro documento. Document.featurePolicy
Experimental Read only-
Devuelve la interfaz
FeaturePolicy
que proporciona una API simple para analizar las políticas de funciones aplicadas a un documento específico. Document.scripts
Read only-
Devuelve un
HTMLCollection
de los elementos<script>
del documento. Document.scrollingElement
Read only-
Devuelve una referencia al
Element
que desplaza el documento. Document.styleSheets
Read only-
Devuelve un objeto
StyleSheetList
deCSSStyleSheet
para hojas de estilo explícitamente vinculadas o incrustadas en un documento. Document.timeline
Experimental Read only-
Devuelve la línea de tiempo como una instancia especial de
DocumentTimeline
que se crea automáticamente al cargar la página. Document.visibilityState
Read only-
Devuelve un
string
que indica el estado de visibilidad del documento. Los valores posibles sonvisible
,hidden
,prerender
yunloaded
.
Extensiones para HTMLDocument
La interfaz Document
para documentos HTML hereda de la interfaz HTMLDocument
o, desde HTML5, se amplía para dichos documentos.
-
Devuelve una lista separada por punto y coma de las cookies para ese documento o establece una sola cookie.
Document.defaultView
Read only-
Devuelve una referencia al objeto de la ventana.
Document.designMode
-
Establece u obtiene la capacidad de editar todo el documento.
Document.dir
-
Establece u obtiene la direccionalidad (rtl/ltr) del documento.
Document.domain
Obsoleto-
Establece u obtiene el dominio del documento actual.
Document.lastModified
Read only-
Devuelve la fecha en la que se modificó por última vez el documento.
Document.location
Read only-
Devuelve la URI del documento actual.
Document.readyState
Read only-
Devuelve el estado de carga del documento.
Document.referrer
Read only-
Devuelve el URI de la página que se vinculó a esta página.
Document.title
-
Establece u obtiene el título del documento actual.
Document.URL
Read only-
Devuelve la ubicación del documento como una cadena.
Manejadores de eventos
La interfaz Document
se amplía con manejadores de eventos adicionales definidos en GlobalEventHandlers.
Document.onafterscriptexecute
No estándar-
Representa el código del manejador de eventos para el evento
afterscriptexecute
. Document.onbeforescriptexecute
No estándar-
Representa el código del manejador de eventos para el evento
beforescriptexecute
. Document.onreadystatechange
-
Representa el código del manejador de eventos para el evento
readystatechange
. GlobalEventHandlers.onselectionchange
Experimental-
Es un manejador de eventos que representa el código que se llamará cuando se genere el evento
selectionchange
. Document.onvisibilitychange
-
Es un manejador de eventos que representa el código que se llamará cuando se genere el evento
visibilitychange
.
Propiedades obsoletas
Document.alinkColor
Obsoleto-
Devuelve o establece el color de los enlaces activos en el cuerpo del documento.
Document.all
Obsoleto No estándar-
Proporciona acceso a todos los elementos del documento; devuelve un
HTMLAllCollection
arraigado en el nodo del documento. Esta es una propiedad heredada, no estándar y no debe usarse. Document.anchors
Obsoleto Read only-
Devuelve una lista de todos los anclajes en el documento.
Document.applets
Obsoleto Read only-
Devuelve una lista ordenada de los subprogramas dentro de un documento.
Document.bgColor
Obsoleto-
Establece u obtiene el color de fondo del documento actual.
Document.charset
Obsoleto Read only-
Alias de
Document.characterSet
. Utilice esta propiedad en su lugar. Document.fgColor
Obsoleto-
Establece u obtiene el color de primer plano o el color del texto del documento actual.
Document.fullscreen
Obsoleto-
Devuelve
true
cuando el documento está en modo pantalla completa. Document.height
No estándar Obsoleto-
Establece u obtiene la altura del documento actual.
Document.inputEncoding
Obsoleto Read only-
Alias de
Document.characterSet
. Utilice esta propiedad en su lugar. Document.lastStyleSheetSet
Obsoleto Read only-
Devuelve el nombre del conjunto de hojas de estilo que se habilitó por última vez. Tiene el valor
null
hasta que se cambia la hoja de estilo estableciendo el valor deselectedStyleSheetSet
. Document.linkColor
Obsoleto-
Establece u obtiene el color de los hipervínculos en el documento.
Document.preferredStyleSheetSet
Obsoleto Read only-
Devuelve el conjunto de hojas de estilo preferido según lo especificado por el autor de la página.
Document.rootElement
Obsoleto-
Como
Document.documentElement
, pero solo para elementos<svg>
raíz. Utilice esta propiedad en su lugar. Document.selectedStyleSheetSet
Obsoleto-
Devuelve qué conjunto de hojas de estilo está actualmente en uso.
Document.styleSheetSets
Obsoleto Read only-
Devuelve una lista de los conjuntos de hojas de estilo disponibles en el documento.
Document.vlinkColor
Obsoleto-
Establece u obtiene el color de los hipervínculos visitados.
Document.width
No estándar Obsoleto-
Devuelve el ancho del documento actual.
Document.xmlEncoding
Obsoleto-
Devuelve la codificación determinada por la declaración XML.
Document.xmlStandalone
Obsoleto-
Devuelve
true
si la declaración XML especifica que el documento sea independiente (p. ej., Una parte externa de la DTD afecta el contenido del documento), de lo contrario,false
. Document.xmlVersion
Obsoleto-
Devuelve el número de versión como se especifica en la declaración XML o
"1.0"
si la declaración está ausente.
Métodos
Esta interfaz también hereda de las interfaces Node
y EventTarget
.
Document.adoptNode()
-
Adopta un nodo de un documento externo.
Document.append()
-
Inserta un conjunto de objetos
Node
u objetosDOMString
después del último elemento hijo del documento. Document.captureEvents()
Obsoleto-
Consulte
Window.captureEvents
. Document.caretPositionFromPoint()
-
Devuelve un objeto
CaretPosition
que contiene el nodo DOM que contiene el signo de intercalación y el desplazamiento del carácter del signo de intercalación dentro de ese nodo. Document.caretRangeFromPoint()
No estándar-
Obtiene un objeto
Range
para el fragmento de documento bajo las coordenadas especificadas. Document.createAttribute()
-
Crea un nuevo objeto
Attr
y lo devuelve. Document.createAttributeNS()
-
Crea un nuevo nodo de atributo en un espacio de nombres determinado y lo devuelve.
Document.createCDATASection()
-
Crea un nuevo nodo CDATA y lo devuelve.
Document.createComment()
-
Crea un nuevo nodo de comentario y lo devuelve.
Document.createDocumentFragment()
-
Crea un nuevo fragmento de documento.
Document.createElement()
-
Crea un nuevo elemento con el nombre de etiqueta dado.
Document.createElementNS()
-
Crea un nuevo elemento con el nombre de etiqueta y el URI de espacio de nombres dados.
Document.createEntityReference()
Obsoleto-
Crea un nuevo objeto de referencia de entidad y lo devuelve.
Document.createEvent()
-
Crea un objeto de evento.
Document.createNodeIterator()
-
Crea un objeto
NodeIterator
. Document.createProcessingInstruction()
-
Crea un nuevo objeto
ProcessingInstruction
. Document.createRange()
-
Crea un objeto
Range
. Document.createTextNode()
-
Crea un nodo de texto.
Document.createTouch()
Obsoleto-
Crea un objeto
Touch
. Document.createTouchList()
Obsoleto-
Crea un objeto
TouchList
. Document.createTreeWalker()
-
Crea un objeto
TreeWalker
. Document.elementFromPoint()
-
Devuelve el elemento superior en las coordenadas especificadas.
Document.elementsFromPoint()
-
Devuelve una matriz de todos los elementos en las coordenadas especificadas.
Document.enableStyleSheetsForSet()
Obsoleto-
Habilita las hojas de estilo para el conjunto de hojas de estilo especificado.
Document.exitPictureInPicture()
-
Retira el video de la ventana flotante de picture-in-picture y vuelve a su contenedor original.
Document.exitPointerLock()
Experimental-
Libera el bloqueo del puntero.
Document.getAnimations()
-
Devuelve una matriz de todos los objetos
Animation
actualmente en uso, cuyos elementos de destino son descendientes dedocument
. Document.getBoxQuads()
Experimental-
Devuelve una lista de objetos
DOMQuad
que representan los fragmentos CSS del nodo. Document.getElementById()
-
Devuelve una referencia de objeto al elemento identificado.
Document.getElementsByClassName()
-
Devuelve una lista de elementos con el nombre de clase dado.
Document.getElementsByTagName()
-
Devuelve una lista de elementos con el nombre de etiqueta dado.
Document.getElementsByTagNameNS()
-
Devuelve una lista de elementos con el nombre de etiqueta y el espacio de nombres dados.
Document.getSelection()
-
Devuelve un objeto
Selection
que representa el rango de texto seleccionado por el usuario o la posición actual del signo de intercalación. Document.hasStorageAccess()
Experimental-
Devuelve un
Promise
que se resuelve con un valor booleano que indica si el documento tiene acceso a su almacenamiento propio. Document.importNode()
-
Devuelve un clon de un nodo de un documento externo.
Document.normalizeDocument()
Obsoleto-
Reemplaza entidades, normaliza nodos de texto, etc.
Document.prepend()
-
Inserta un conjunto de objetos
Node
u objetosDOMString
antes del primer elemento hijo del documento. Document.querySelector()
-
Devuelve el primer nodo Element dentro del documento, en el orden del documento, que coincide con los selectores especificados.
Document.querySelectorAll()
-
Devuelve una lista de todos los nodos Element dentro del documento que coinciden con los selectores especificados.
Document.releaseCapture()
No estándar-
Libera la captura actual del mouse si está en un elemento de este documento.
Document.releaseEvents()
No estándar Obsoleto-
Consulte
Window.releaseEvents()
. Document.replaceChildren()
-
Reemplaza los elementos hijos existentes de un documento con un nuevo conjunto específico de elementos hijos.
Document.requestStorageAccess()
-
Devuelve un
Promise
que resuelve si se otorgó el acceso al almacenamiento propio y lo rechaza si se denegó el acceso. Document.mozSetImageElement()
No estándar-
Le permite cambiar el elemento que se utiliza como imagen de fondo para un ID de elemento específico.
La interfaz Document
se amplía con la interfaz XPathEvaluator
:
Document.createExpression()
-
Compila una
XPathExpression
que luego se puede usar para (repetidas) evaluaciones. Document.createNSResolver()
-
Crea un objeto
XPathNSResolver
. Document.evaluate()
-
Evalúa una expresión XPath.
Extensión para documentos HTML
La interfaz Document
para documentos HTML se hereda de la interfaz HTMLDocument
o, desde HTML5, se amplía para dichos documentos:
Document.clear()
No estándar Obsoleto-
En la mayoría de los navegadores modernos, incluidas las versiones recientes de Firefox e Internet Explorer, este método no hace nada.
Document.close()
-
Cierra el flujo de escritura en el documento.
Document.execCommand()
Obsoleto-
En un documento editable, ejecuta un comando de formato.
Document.getElementsByName()
-
Devuelve una lista de elementos con el nombre dado.
Document.hasFocus()
-
Devuelve
true
si el foco se encuentra actualmente en cualquier lugar dentro del documento especificado. Document.open()
-
Abre un flujo de escritura para el documento.
Document.queryCommandEnabled()
Obsoleto-
Devuelve
true
si el comando de formato se puede ejecutar en el rango actual. Document.queryCommandIndeterm()
Obsoleto-
Devuelve
true
si el comando de formato está en un estado indeterminado en el rango actual. Document.queryCommandState()
Obsoleto-
Devuelve
true
si el comando de formato se ha ejecutado en el rango actual. Document.queryCommandSupported()
Obsoleto-
Devuelve
true
si el comando de formato es compatible con el rango actual. Document.queryCommandValue()
Obsoleto-
Devuelve el valor actual del rango actual para un comando de formato.
Document.write()
-
Escribe texto en un documento.
Document.writeln()
-
Escribe una línea de texto en un documento.
Eventos
Puede detectar estos eventos usando addEventListener()
o asignando un detector de eventos a la propiedad oneventname
de esta interfaz.
scroll
-
Se activa cuando se ha desplazado la vista del documento o un elemento. También disponible a través de la propiedad
onscroll
. visibilitychange
-
Se activa cuando el contenido de una pestaña se vuelve visible o se oculta. También disponible a través de la propiedad
onvisibilitychange
. wheel
-
Se activa cuando el usuario gira un botón de rueda en un dispositivo señalador (generalmente un mouse). También disponible a través de la propiedad
onwheel
.
Eventos de animación
animationcancel
-
Se activa cuando una animación aborta inesperadamente. También disponible a través de la propiedad
onanimationcancel
. animationend
-
Se activa cuando una animación se ha completado normalmente. También disponible a través de la propiedad
onanimationend
. animationiteration
-
Se activa cuando se completa una iteración de animación. También disponible a través de la propiedad
onanimationiteration
. animationstart
-
Se activa cuando comienza una animación. También disponible a través de la propiedad
onanimationstart
.
Eventos del portapapeles
copy
-
Se activa cuando el usuario inicia una acción de copiar a través de la interfaz de usuario del navegador.
cut
-
Se activa cuando el usuario inicia una acción de cortar a través de la interfaz de usuario del navegador.
paste
-
Se activa cuando el usuario inicia una acción de pegar a través de la interfaz de usuario del navegador.
Eventos de arrastrar y soltar
drag
-
Se activa cada pocos cientos de milisegundos cuando el usuario arrastra un elemento o una selección de texto. También disponible a través de la propiedad
ondrag
. dragend
-
Se activa cuando finaliza una operación de arrastre (soltando un botón del mouse o presionando la tecla Escape). También disponible a través de la propiedad
ondragend
. dragenter
-
Se activa cuando un elemento arrastrado o una selección de texto ingresa en un destino de colocación válido. También disponible a través de la propiedad
ondragenter
. dragleave
-
Se activa cuando un elemento arrastrado o una selección de texto deja un destino de colocación válido. También disponible a través de la propiedad
ondragleave
. dragover
-
Se activa cuando se arrastra un elemento o una selección de texto sobre un destino de colocación válido (cada pocos cientos de milisegundos). También disponible a través de la propiedad
ondragover
. dragstart
-
Se activa cuando el usuario comienza a arrastrar un elemento o una selección de texto. También disponible a través de la propiedad
ondragstart
. drop
-
Se activa cuando un elemento o una selección de texto se coloca en un destino de colocación válido. También disponible a través de la propiedad
ondrop
.
Eventos de pantalla completa
fullscreenchange
-
Se activa cuando
Document
pasa al modo de pantalla completa o sale del mismo. fullscreenerror
-
Se activa si se produce un error al intentar activar o desactivar el modo de pantalla completa.
Eventos de teclado
keydown
-
Se activa cuando se presiona una tecla. También disponible a través de la propiedad
onkeydown
. keypress
-
Se activa cuando se presiona una tecla que produce un valor de carácter. También disponible a través de la propiedad
onkeypress
. keyup
-
Se activa cuando se suelta una tecla. También disponible a través de la propiedad
onkeyup
.
Eventos de carga y descarga
DOMContentLoaded
-
Se activa cuando el documento se ha cargado y analizado por completo, sin esperar a que las hojas de estilo, las imágenes y los submarcos terminen de cargarse.
readystatechange
-
Se activa cuando el atributo
readyState
de un documento ha cambiado. También disponible a través de la propiedadonreadystatechange
.
Eventos de puntero
gotpointercapture
-
Se activa cuando un elemento captura un puntero usando
setPointerCapture()
. También disponible a través de la propiedadongotpointercapture
. lostpointercapture
-
Se activa cuando se suelta un puntero capturado. También disponible a través de la propiedad
onlostpointercapture
. pointercancel
-
Se activa cuando se cancela un evento de puntero. También disponible a través de la propiedad
onpointercancel
. pointerdown
-
Se activa cuando un puntero se vuelve activo. También disponible a través de la propiedad
onpointerdown
. pointerenter
-
Se activa cuando se mueve un puntero a los límites de la prueba de acierto de un elemento o uno de sus hijos. También disponible a través de la propiedad
onpointerenter
. pointerleave
-
Se activa cuando un puntero se mueve fuera de los límites de la prueba de acierto de un elemento. También disponible a través de la propiedad
onpointerleave
. pointerlockchange
-
Se activa cuando el puntero está bloqueado o desbloqueado. También disponible a través de la propiedad
onpointerlockchange
. pointerlockerror
-
Se activa cuando falla el bloqueo del puntero. También disponible a través de la propiedad
onpointerlockerror
. pointermove
-
Se activa cuando un puntero cambia de coordenadas. También disponible a través de la propiedad
onpointermove
. pointerout
-
Se activa cuando un puntero se mueve fuera de los límites de la prueba de acierto de un elemento (entre otras razones). También disponible a través de la propiedad
onpointerout
. pointerover
-
Se activa cuando se mueve un puntero a los límites de la prueba de acierto de un elemento. También disponible a través de la propiedad
onpointerover
. pointerup
-
Se activa cuando un puntero ya no está activo. También disponible a través de la propiedad
onpointerup
.
Eventos de selección
selectionchange
-
Se activa cuando se cambia la selección de texto actual en un documento. También disponible a través de la propiedad
onselectionchange
. selectstart
-
Se activa cuando el usuario comienza una nueva selección. También disponible a través de la propiedad
onselectstart
.
Eventos táctiles
touchcancel
-
Se activa cuando uno o más puntos de contacto se han interrumpido de una manera específica de la implementación (por ejemplo, se crean demasiados puntos de contacto). También disponible a través de la propiedad
ontouchcancel
. touchend
-
Se activa cuando uno o más puntos de contacto se eliminan de la superficie táctil. También disponible a través de la propiedad
ontouchend
touchmove
-
Se activa cuando uno o más puntos de contacto se mueven a lo largo de la superficie táctil. También disponible a través de la propiedad
ontouchmove
touchstart
-
Se activa cuando se colocan uno o más puntos de contacto en la superficie táctil. También disponible a través de la propiedad
ontouchstart
Eventos de transición
transitioncancel
-
Se activa cuando se cancela una transición de CSS. También disponible a través de la propiedad
ontransitioncancel
. transitionend
-
Se activa cuando se completa una transición de CSS. También disponible a través de la propiedad
ontransitionend
. transitionrun
-
Se activa cuando se crea por primera vez una transición de CSS. También disponible a través de la propiedad
ontransitionrun
. transitionstart
-
Se activa cuando realmente ha comenzado una transición de CSS. También disponible a través de la propiedad
ontransitionstart
.
Extensiones no estándar No estándar
No estándar: Esta característica no es parte de los estándares. No la uses en sitios Web en producción: no funcionará para todos los usuarios. Podrían haber también incompatibilidades considerables entre distintas implementaciones y el comportamiento podría cambiar en el futuro.
Notas de firefox
Firefox define algunos métodos no estándar:
Document.execCommandShowHelp()
Obsoleto-
Este método nunca hizo nada y siempre arrojaba una excepción, por lo que se eliminó en Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11).
Document.getBoxObjectFor()
Obsoleto-
Utilice el método
Element.getBoundingClientRect()
en su lugar. Document.loadOverlay()
Obsoleto-
Carga una superposición XUL dinámicamente. Esto solo funciona en documentos XUL.
Document.queryCommandText()
Obsoleto-
Este método nunca hizo nada más que generar una excepción y se eliminó en Gecko 14 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11).
Notas de Internet Explorer
Microsoft define algunos métodos no estándar:
Document.fileSize
* No estándar Obsoleto-
Devuelve el tamaño en bytes del documento. A partir de Internet Explorer 11, esa propiedad ya no se admite. Consulte MSDN.
Especificaciones
Compatibilidad con navegadores
BCD tables only load in the browser