Question

我一直在尝试创建一个可以扩展和收缩onclick的textnode，但它拒绝在google chrome中工作并在firefox中显示[object Text]，我哪里出错？

window.onload = function ()
document.getElementById("myBtn").addEventListener("click",
 textchange);

function textchange() {
  var status = "less";
  var text = document.createTextNode('Mmm ... something');


  if (status == "less") {
      document.getElementById("textArea").innerHTML = text;

      status = "more";
  } else if (status == "more") {
      document.getElementById("textArea").innerHTML = "";

      status = "less"
  }
}

Answer 1

嗯，不确定为什么Chrome不喜欢.innerHTML =，但我尝试将其替换为.appendChild()并且可行。试试这个：

var status = "less";
document.getElementById("myBtn").addEventListener("click", textchange);

function textchange() {
    var text = document.createTextNode('Mmm ... something');
    /* var text="<a href='index.php'>Index</a>";
     */
    if (status == "less") {
        document.getElementById("textArea").innerHTML = "";
        document.getElementById("textArea").appendChild(text);

        status = "more";
    } else if (status == "more") {
        document.getElementById("textArea").innerHTML = "";

        status = "less"
    }

}

顺便说一下，在var status="less"函数之外声明textchange()。这样它就是全局的，每次点击#myBtn时都不会重置。

创建textnode展开并隐藏

1 个答案: