Métodos DOM de JavaScript


Tabla de contenido

    Mostrar tabla de contenidos


Los métodos HTML DOM son acciones que puedes realizar (en HTML Elementos).

Las propiedades HTML DOM son valores (de elementos HTML) que puede establecer o cambiar.


La interfaz de programación DOM

Se puede acceder al HTML DOM con JavaScript (y con otros lenguajes de programación).

En el DOM, todos los elementos HTML se definen como objetos.

La interfaz de programación es las propiedades y métodos de cada objeto.

Una propiedad es un valor que puede obtener o establecer (como cambiar el contenido de un elemento HTML).

Un método es una acción que puedes realizar (como agregar o eliminar un elemento HTML).


Ejemplo

El siguiente ejemplo cambia el contenido (el innerHTML) del elemento <p> con id="demostración":

Ejemplo

<html>
<body>

<p id="demo"></p>

<script>
 document.getElementById("demo").innerHTML = "Hello World!";
</script>

</body>
</html>

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h2>My First Page</h2>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>

</body>
</html>

En el ejemplo anterior, getElementById es un método, mientras que innerHTML es un propiedad.


El método getElementById

La forma más común de acceder a un elemento HTML es utilizar el id del elemento.

En el ejemplo anterior, el método getElementById utilizó id="demo" para encontrar el elemento.


La propiedad internalHTML

La forma más sencilla de obtener el contenido de un elemento es mediante la propiedad innerHTML.

La propiedad innerHTML es útil para obtener o reemplazar el contenido de elementos HTML.

La propiedad innerHTML se puede utilizar para obtener o cambiar cualquier elemento HTML, incluyendo <html> y <body>.