Método getElementById() del Documento HTML DOM

Definición y uso

getElementById() El método devuelve el elemento con el valor de id especificado.

Si el elemento no existe,getElementById() El método devolverá null.

getElementById() El método es uno de los más utilizados en HTML DOM. Casi siempre que desee leer o editar un elemento HTML, lo usará.

Consejo

Cualquier id debe ser único, pero:

Si existen dos o más elementos con el mismo id, entonces getElementById() Devuelve el primero.

Vea también:

Método getElementsByTagName()

Método getElementsByClassName()

Método querySelector()

Método querySelectorAll()

Ejemplo

Ejemplo 1

Obtener el elemento con el id especificado:

document.getElementById("demo");

por su cuenta

Ejemplo 2

Obtener el elemento y cambiar su color:

const myElement = document.getElementById("demo");
myElement.style.color = "red";

por su cuenta

Ejemplo 3

o bien, cambiar únicamente su color:

document.getElementById("demo").style.color = "red";

por su cuenta

pruebe

document.getElementById(elementIdsintaxis

)

) tipo
elementId parámetros

obligatorio. Valor del id del elemento.

valor de retorno tipo
descripción

objeto

elemento con el id especificado.

Si no se encuentra, devuelve null.

getElementById() Detalles técnicos

Este método es un método importante y común, ya que proporciona una manera sencilla de obtener el objeto Element que representa el elemento de documento especificado. elementId Este método recupera el valor del atributo id null. El valor del atributo id es único en el documento, si este método encuentra múltiples nodos Element con el id especificado, lo devuelve. Si no encuentra ningún elemento con este id, devuelve elementId El nodo Element, que devuelve un nodo Element aleatorio de este tipo o null.

Nota:El nombre de este método comienza con Id con finalización ID¡No escriba mal!

En documentos HTML, este método siempre recupera el atributo con el id especificado. Utilice HTMLDocument.getElementByName() método, buscando elementos HTML según el valor de su atributo name.

En documentos XML, este método utiliza cualquier atributo de tipo id para buscar, sin importar el nombre del atributo. Si el tipo del atributo XML es desconocido (como cuando el analizador XML lo ignora o no puede localizar el DTD del documento), este método siempre devuelve nullEn JavaScript del cliente, este método no se utiliza a menudo con documentos XML. De hecho:getElementById() Inicialmente, el método se definió como miembro de la interfaz HTMLDocument, pero se trasladó al interfaz Document en la versión 2 del DOM.

Compatibilidad del navegador

document.getElementById() es una característica de DOM Level 2 (2001).

Todos los navegadores lo admiten:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Soporte 9-11 Soporte Soporte Soporte Soporte

Páginas relacionadas

Tutoriales de CSS:Sintaxis de CSS

Manual de referencia de CSS:Selector #id de CSS

Manual de referencia de HTML DOM:Atributo id de HTML DOM

Manual de referencia de HTML DOM:Objeto Style de HTML DOM