Hacer esto de una mejor manera

  • Autor Autor SoyENP
  • Fecha de inicio Fecha de inicio
SoyENP

SoyENP

Beta
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Queria hacer algo parecido al plugin de cool tags, me interesaba el boton de mostrar mas y menos, asi que hice esto

const boxTags = document.querySelector('.tags-box');
const btnTags = document.querySelector('.btn-tags');

if (boxTags.clientHeight > 125) {
btnTags.style.display = 'inline-block';
boxTags.style.height = '125px';

btnTags.addEventListener('click', () => {
if (boxTags.style.height === '125px') {
boxTags.style.height = 'max-content';
btnTags.innerHTML = 'Show Less';
} else if (boxTags.style.height === 'max-content') {
boxTags.style.height = '125px';
btnTags.innerHTML = 'Show More';
}
});
}

boxTags es el contenedor de la nube de etiquetas y btnTags es el boton de mostrar mas/menos.

Queria saber si esto esta bien hecho o es posible hacerlo mejor, soy novato en javascript
 
Tienes la referencia de como lo quieres?
 
Tienes la referencia de como lo quieres?
El resultado me quedo de lujo, solo busco una forma de escribir el codigo diferente sin usar if, algo mas corto y efectivo, es posible o asi con los if esta bien?
 
Por supuesto que se puede optimizar ese código, busca información sobre los operadores ternarios y sobre el uso de las variables. (por ej: repites hasta tres(03) veces el valor '125px', cuando lo puedes haber puesto en una variable que contenga ese valor). No te saltes lo básico. 😉 👍
 
Hay una vieja regla: si funciona, no lo arregles.
 
Hay una vieja regla: si funciona, no lo arregles.
concuerdo contigo, tantas veces he querido mejorar un codigo antiguo para hacerlo lo mas optimo o darle una mejora muy simple y al final acabo con un rompecabezas porque se me olvido una copia de seguridad
 
Atrás
Arriba