创建textnode展开和隐藏

Question

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

http://jsfiddle.net/jonSnow70/uf1bbk5q/

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时都不会重置。