HTML

Recorrer lista en Thymeleaf y Spring Boot usando th each

th:each en Thymeleaf para recorrer listas

En este post te mostraré a usar th:each en Thymeleaf para iterar o recorrer colecciones, algo así como dibujar una lista o repetir un elemento HTML. Además de repetir una lista te enseñaré la sintaxis básica de th:each. Finalmente veremos un ejemplo con Spring Boot para renderizar una lista de productos traída desde un repositorio […]

th:each en Thymeleaf para recorrer listas Leer más »

Documento modificado con querySelector y querySelectorAll en JavaScript

querySelector y querySelectorAll en JavaScript

Explicación de querySelector y querySelectorAll en JavaScript Introducción a querySelector y querySelectorAll en JS. En este post te explicaré dos funciones de JavaScript que funcionan para obtener referencia a un elemento del DOM. Estoy hablando de: document.querySelector document.querySelectorAll Que bien son un remplazo de document.getElementById y otras funciones un poco complejas.

querySelector y querySelectorAll en JavaScript Leer más »

Asociar información a elementos dinámicos con JavaScript

JavaScript – Asociar información a elementos dinámicos con data-*

Uso de los atributos data en HTML y JavaScript Los atributos data de HTML son atributos personalizados que ayudan a asociar información a un elemento HTML (incluso si es creado de manera dinámica) con JavaScript. Estos atributos vienen de maravilla cuando tenemos elementos dinámicos y queremos acceder a ellos en el click de un botón

JavaScript – Asociar información a elementos dinámicos con data-* Leer más »

Dibujar tabla HTML con JavaScript - Tabla dinámica de productos

Dibujar tabla HTML dinámica con JavaScript

Renderizar o dibujar una tabla HTML con JavaScript En este post te mostraré a crear una tabla dinámica o elemento <table> de HTML con JavaScript. Es decir, con JavaScript puro dibujar una tabla, agregarle filas y columnas. Para ello no usaremos ningún framework. Las funciones que veremos son: document.createElement – Para crear un elemento, en

Dibujar tabla HTML dinámica con JavaScript Leer más »