javascript - 切换元素 FontWeight - Javascript

Question

我正在尝试通过按下按钮将文本区域内的文本切换为粗体或非粗体。我有以下代码:

function bold()
{
    var ta = document.getElementById("textArea");

    if(ta.style.fontWeight == "normal"){
        ta.style.fontWeight = "bold";
    }
    else{
        ta.style.fontWeight = "normal";
    }
}

当我按下按钮时，第一次没有任何反应。但我第二次按下它，它运行得很好。通过调试器运行它，变量“ta”第一次变为等于“”，然后第二次变为“正常”，尽管文本区域在 css 中设置为正常。

有什么想法吗？

谢谢

Answer 1

所以发生这种情况的原因是因为 ta.style正在访问 textarea 元素的 style 属性，它不会有任何关于来自 CSS 的样式的信息。你可以像这样写你的文本区域，它应该与你所拥有的一起工作:

<textarea id="textArea" style="font-weight:normal"></textarea>

但是，我建议你在你的 js 中按照这些行做一些事情:

function bold()
{
    var ta = document.getElementById("textArea");

    if(ta.style.fontWeight !== "bold"){
        ta.style.fontWeight = "bold";
    }
    else{
        ta.style.fontWeight = "normal";
    }
}

将您的函数重命名为 toggleBold 也可能会有所帮助;)