Javascript Clase 9 Flashcards
DOM
Es una estructura generada por el navegador que representa el html actual.
Las etiquetas son al html, los nodos son a las etiquetas.
Una de las formas de acceder a estas es por: document.body.
Estructura DOM
ada etiqueta HTML se tranforma en un “nodo elemento”.
La estructura del nodo raiz document se divide en: head y body.
Por lo general las etiquetas nodo crean dos nodos:
Nodo elemento: corresponde a la etiqueta html.
Nodo texto: el texto contenido en la etiqueta.
Para acceder elementos del DOM se utilizan los siguiente codigos:
-getElementById()
-getElementsByClassName()
-getElementsByTagName()
getElementById()
Se accede al elemento por la id.
getElementsByClassName()
Se accede al elemento por la clases en un array con objetos.
getElementsByTagName()
Se accede al elemento por el tag en un array con objetos.
Modificar nodos
InnerText
Permite modificar el nodo de texto
Modificar nodos
InnerHTML
Permite modificar la estructura html junto con el contenido.
Modificar nodos
Propiedad classname
permite poder modificar el atributo de clase del nodo.
Agregar y eliminar nodos
agregar
para agregar nodos se utiliza la propiedad document.createElement() y luego a este se le agrega contenido
para terminar con un append() al nodo.
Agregar y eliminar nodos
Eliminar
para eliminar el nodo referenciado se ocupa la propiedad remove();
Agregar y eliminar nodos
Obtener inputs
se hace refencia al nodo y se le agrega la propiedad “value=’’”.
ES6 se utilizan plantillas
Usadas para poder agregar variables al texto sin afectar a la comprensión de este.
Query selector
Permite seleccionar un nodo con una sintaxis de css como parametro devolviendo un array con el elemento.
Query selector All
Permite seleccionar varios nodos con una sintaxis de css como parametro devolviendo un array con los elementos.
