¿Cómo funciona getElementByID en JavaScript?

El método de documento getElementById() devuelve un objeto de elemento que representa el elemento cuya propiedad id coincide con el valor dado. Este método se usa para manipular un elemento en nuestro documento y se usa ampliamente en el diseño web para cambiar el valor de cualquier elemento en particular u obtener un elemento en particular. Si la ID pasada al método no existe, devuelve nulo.

Se debe utilizar una identificación única en las páginas web. Aunque, si existe más de un elemento para la identificación específica, entonces el único primer elemento considerará y devolverá getElementByID en el código.

Sintaxis:

const gfg = document.getElementById(id);

Parámetros:

  • id: El id del elemento que queremos agarrar. es una string que distingue entre mayúsculas y minúsculas y es única dentro del documento.

Valor devuelto: un objeto de elemento con la identificación especificada, o nulo si no se encuentra ningún elemento coincidente. 

Ejemplo: El siguiente ejemplo ilustra el uso de getElementById, obteniendo el elemento que tiene el atributo id para el valor especificado.

HTML

<!DOCTYPE html>
<html lang="en">
 
<body>
     
    <!-- defining an element with an id -->
    <h1 id="gfg">GeeksforGeeks</h1>
     
    <!-- Adding javascript -->
    <script>
     
    // Grabbing element
    const gfg = document.getElementById('gfg');
    console.log(gfg.innerText)
    </script>
</body>
 
</html>

Salida: aquí puede ver «GeeksforGeeks» impreso en la pestaña de la consola. Ahora, después de capturar un elemento, podemos realizar cualquier operación en ese elemento, como cambiar texto, agregar estilo, etc.

getElementByID

Publicación traducida automáticamente

Artículo escrito por hritikrommie y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *