Necesito cambiar una etiqueta de anclaje de esto
<a href="#" id="masini">Mașini <i class="bi bi-caret-right"></i></a>a esto
<a href="#" id="masini">Mașini <i class="bi bi-caret-down"></i></a>cuando la pantalla se hace más pequeña. Básicamente para ser receptivo. Necesito usar javascript por cierto.
Probé el siguiente código pero no funciona.
if(window.innerWidth < 1130px) { var replace = "Mașini" replace += "<i class="bi bi-caret-down"></i>"; document.getElementById("masini").innerHTML = replace; }Recomiendo apuntar al elemento <i> y cambiar su clase:
if (window.innerWidth < 1130) { const iElement = document.querySelector("#masini i"); iElement.classList.replace("bi-caret-right", "bi-caret-down"); }Ayudaría hacer lo siguiente:
if (window.innerWidth < 1130) { document.getElementById("masini").className = "bi bi-caret-down"; } <a href="#">Mașini <i id="masini" class="bi bi-caret-right"></i></a>Debe delimitar sus comillas dobles o ajustarlas con comillas simples.
replace += '<i class="bi bi-caret-down"></i>';O:
replace += "<i class=\"bi bi-caret-down\"></i>";