O toggleClass() é um método do jQuery que adiciona ou remove uma classe CSS de um determinado elemento, o seu uso mais comum eu diria que é para renderizar ou não determinado elemento HTML, esse efeito conhecido como hide/show funciona adicionando e removendo uma classe com um display: none, mas o toggleClass() é útil para qualquer efeito de mudanças de CSS.
HTML:
<button onclick="toggleClass('#divHide')"> Mostrar/Esconder </button> <div class="hidden" id="divHide">Alguma informação legal</div>
JavaScript(1):
function toggleClass(el){ el = document.querySelector(el); className = 'hidden'; if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = classes.indexOf(className); if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); } }
Classe hidden:
.hidden { display: none !important; }
Referências:
- http://youmightnotneedjquery.com/