javascript - 使用 JavaScript 单击时更改按钮上的文本

Question

我试图在用 JavaScript 按下按钮时更改按钮的文本。应该非常简单，但是，它不起作用。谁能解释一下吗？这是我的代码:

function changeInnerHTML() {
  var buttonValue = document.getElementById('elementTEST').innerHTML;
  var buttonValueInnerHTMLBegin = '<p id="elementTEST">';
  var buttonValueInnerHTMLEnd = '</p>';
  alert("buttonValue = " + typeof(buttonValue)); // -> "string"
  if (buttonValue == "Online") {
    alert("turn off"); // -> "turn off"
    buttonValue = buttonValueInnerHTMLBegin + "Offline" + buttonValueInnerHTMLEnd; // -> DOESN'T CHANGE ANYTHING
    alert("turned off"); // -> "turned off"
  } else if (buttonValue == "Offline") {
    buttonValue = "Online";
  } else {
    alert("There's a problem");
  }
}

<div class="containerTEST">
  <div class="divTEST" onclick="changeInnerHTML()">
    <p id="elementTEST">Online</p>
  </div>
</div>

我在包含和不包含“buttonValueInnerHTMLBegin/End”变量的情况下都运行了此命令，并且得到了相同的结果。

我收到警报(在代码中显示为注释)，但文本/innerHTML 没有更改。

感谢您的帮助!

Answer 1

这不是一个引用，您必须直接在最后设置它:

document.getElementById('elementTEST').innerHTML = buttonValue