Quiero alternar entre el estilo de fuente. Por ejemplo: si el estilo de fuente no existe en un elemento o si está en cursiva u oblicuo para insertar normal, si es normal eliminar el estilo de fuente después de hacer clic en el botón normal.
Traté de resolver esto insertando más variables en if (a || b|| c), pero no funciona. ¿Es esta la forma correcta y es posible o estoy equivocado en alguna parte del código?
<div id="fontstyle">font-style</div> <button onclick="ElementTextStyleNormal()">Normal</button> <button onclick="ElementTextItalic()">Italic</button> <button onclick="ElementTextOblique()">Oblique</button> function ElementTextStyleNormal(){ var x = document.getElementById("fontstyle").style.fontStyle; if (!(x == "" || x == "italic" || x == "oblique")) { document.getElementById("fontstyle").style.fontStyle = "normal"; } else if (x == "normal") { document.getElementById("fontstyle").style.fontStyle = ""; } } function ElementTextItalic(){ var x = document.getElementById("fontstyle").style.fontStyle; if (!((x == '') || (x == 'normal') || (x == 'oblique'))) { document.getElementById("fontstyle").style.fontStyle = "italic"; } else if (x == "italic") { document.getElementById("fontstyle").style.fontStyle = ""; } } function ElementTextOblique(){ var x = document.getElementById("fontstyle").style.fontStyle; if (!((x == '') || (x == 'normal') || (x == 'italic'))) { document.getElementById("fontstyle").style.fontStyle = "oblique"; } else if (x == "oblique") { document.getElementById("fontstyle").style.fontStyle = ""; } }Intente simplificar esto usando una sola función y pasando el nombre de estilo como parámetro de función.
function ElementTextStyle(styleName){ var elem = document.getElementById("fontstyle"); elem.style.fontStyle = elem.style.fontStyle === styleName ? "" : styleName; } <div id="fontstyle">font-style</div> <button onclick="ElementTextStyle('normal')">Normal</button> <button name="italic" onclick="ElementTextStyle('italic')">Italic</button> <button name="oblique" onclick="ElementTextStyle('oblique')">Oblique</button>