javascript - 依次在javascript中的同一onclick事件上调用两个不同的函数

我有一个divcontent当我单击另一个div namebutton时，它的高度应该是300px。
但是，当再次单击buttondiv时，如何重置高度？
以下是供参考的javascript代码：

function chk()
{
    var x = document.getElementById('content').style.height = '300px';

}

这是HTML代码

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

当buttondiv是单击内容高度增加时，如何通过单击具有相同on click事件的相同div来降低高度？

最佳答案

使用CSS：

#content {
    height: auto;
}
#content.expand {
    height: 300px;
}

在你的剧本里：

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

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

这使状态局部保持在您正在处理的元素上，这使得代码更加灵活。
另请参见：classList API

关于javascript - 依次在javascript中的同一onclick事件上调用两个不同的函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20339986/