Question

我有一个javascript函数，用于增加和减少div的高度。

这是代码

function chk()
{
    var node = document.getElementById('content');

    node.classList.toggle('expand');
}

使用此HTML代码：

<div id="hite">
   <div id = "content">
      This is dummy text.
   </div>
   <div id="button" onclick="chk()">
   click to read
   </div>
</div>

我希望文本在button div中更改，一旦用户点击它，再次点击它，文本应该再次“点击阅读”。

Answer 1

尝试添加此内容：

document.getElementById('button').innerHTML = node.classList.contains('expand')? 'hide':'click to read';

http://jsfiddle.net/rooseve/Bup8u/

Answer 2

您可以使用 innerHTML 属性。

 var ele = document.getElementById('button');
    if (ele.innerHTML == "click to read") 
        ele.innerHTML = "User click on it!";
    else 
        ele.innerHTML = "click to read";

Answer 3

如果您只想添加文本而不是html数据，也可以使用“textContent”。

if(document.getElementById("button").textContent!='click to read'){

        document.getElementById("button").textContent="your content";
}else{
        document.getElementById("button").textContent="click to read";
}

执行函数时更改div中的文本

3 个答案: