Olá, tenho o seguinte código que esta funcionando mas quero melhorar ele. Alguma sugestão?
add evento de click
[1, 2, 3].forEach(num => {
document.getElementById(`btn-lupa${num}`).addEventListener("click", () => {
esquemaLupa(num);
});
});
função ocultar
div
function esquemaLupa(num) {
if (num == 1) {
document.getElementById(`feed-lupa-${num}`).style.display = "block";
document.getElementById(`feed-lupa-2`).style.display = "none";
document.getElementById(`feed-lupa-3`).style.display = "none";
}
if (num == 2) {
document.getElementById(`feed-lupa-${num}`).style.display = "block";
document.getElementById(`feed-lupa-1`).style.display = "none";
document.getElementById(`feed-lupa-3`).style.display = "none";
}
if (num == 3) {
document.getElementById(`feed-lupa-${num}`).style.display = "block";
document.getElementById(`feed-lupa-2`).style.display = "none";
document.getElementById(`feed-lupa-1`).style.display = "none";
}
}
Html
<button id="btn-lupa1">1</button>
<button id="btn-lupa2">2</button>
<button id="btn-lupa3">3</button>
<div id="feed-lupa-1">div1</div>
<div id="feed-lupa-2">div2</div>
<div id="feed-lupa-3">div3</div>
.style.display = "none/block";
não é uma boa escolha...