Agregar clase a elemento HTML con Thymeleaf

En este post te mostraré cómo agregar una clase HTML a un elemento (como un div, un párrafo, etcétera) de manera dinámica usando Thymeleaf, un motor de plantillas usado mayormente en Spring Boot.

Para agregar una clase a la lista de clases existentes, se usa:

th:classapend="expresión"

Esta declaración permite agregar una clase además de las que el elemento ya tiene declaradas con el atributo class.

Por ejemplo, si se quiere agregar una clase dependiendo de una variable:

En este caso la clase del elemento HTML es alert, pero con Thymeleaf y classappend se agrega otra clase de manera dinámica.

Suponiendo que la variable clase es alert-success las clases del div quedarían así al final:

<div class="alert alert-success">

Ya que classappend permite agregar una clase a un elemento HTML con Thymeleaf.

Esto funciona igualmente con ifs y operadores ternarios:

Así de fácil se puede agregar una clase dinámica usando Thymeleaf.


Estoy disponible para trabajar en tu proyecto o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.
Si el post fue de tu agrado muestra tu apoyo compartiéndolo, suscribiéndote al blog, siguiéndome o realizando una donación.

Suscribir por correo

Ingresa tu correo y recibirás mis últimas entradas sobre programación, open source, bases de datos y todo lo relacionado con informática

Únete a otros 1,139 suscriptores


parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

0 Comentarios

Deja un comentario

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

A %d blogueros les gusta esto: