Header Ads Widget

Ticker

6/recent/ticker-posts

DOM | Modelo de objetos de documento

 Como sugiere el nombre, en este artículo hablamos de DOM, las siglas de Document object model (DOM ) . En DOM discutimos sus propiedades y métodos programáticos que se utilizan para manipular el documento.

Introducción Modelo de objetos de documento | Que es un DOM

  • En este tutorial de dom, DOM o modelo de objeto de documento es una interfaz de programación de aplicaciones (API) para documentos HTML y XML (Xtensible Markup Language).
  • Define la estructura lógica de los documentos y la forma en que Javascript DOM accede al documento.
  • Es una estructura llamada estructura lógica porque no tienen relaciones entre objetos.
  • Con DOM tenemos fácil acceso y manipulamos las etiquetas HTML, ID, clases, atributos o propiedades utilizando métodos o funciones DOM predefinidos .

Estructura del modelo de objetos de documento

Como la discusión anterior, el DOM tiene una estructura lógica que parece una estructura de árbol. Demostramos esa declaración usando un ejemplo de Form a DOM donde aplicamos métodos DOM.

Todo funciona igual en el modelo de documento en javascript.

DOM (modelo de objeto de documento)

Referencia de la imagen: https://www.geeksforgeeks.org

En la imagen de arriba, se accede a las propiedades de los objetos de documento mediante el método de objeto de documento.

  1. Objeto de ventana: el objeto de ventana siempre está en la parte superior de la jerarquía.
  2. Objeto de documento: cuando se carga HTML en una ventana, se convierte en un objeto de documento.
  3. Objeto de enlace: los objetos de enlace se representan mediante linketiquetas en HTML.
  4. Objeto de formulario: Objetos de formulario definidos por Form etiqueta en HTML.
  5. Objetos de anclaje: Representa <a href=" "> etiqueta.
  6. Elementos de formulario: el formulario puede tener muchos elementos de control como área de texto, casillas de verificación, botones de radio, etc.

Métodos de objetos DOM

  1. document.write ("cadena"): escribe la cadena dada en el documento
  2. document.getElementById (): devuelve el elemento que tiene el valor de id dado.
  3. documento. getElementsByName (): devuelve todos los elementos que tienen el valor de nombre dado.
  4. document.getElementsByTagName (): devuelve todos los elementos que tienen el nombre de etiqueta dado.
  5. document.getElementsByClassName (): devuelve todos los elementos que tienen el nombre de clase dado.

Ejemplo de código de DOM

Codificación feliz ..!

Publicar un comentario

0 Comentarios