Javascript 更改元素'；单击按钮并重命名按钮名称时初始化，反之亦然_Javascript

Javascript 更改元素'；单击按钮并重命名按钮名称时初始化，反之亦然

javascript

Javascript 更改元素'；单击按钮并重命名按钮名称时初始化，反之亦然,javascript,Javascript,我需要你的帮助当我重新单击“展开”按钮时，如何重新最小化（将textarea的类设置回正常值）我可以让它工作，但反过来不行这是我的HTML+Javascript <!DOCTYPE html> <html> <head> <style type="text/css"> .normal { width: 400px; height: 25px; } .expand { height: 400px; wid

我需要你的帮助

当我重新单击“展开”按钮时，如何重新最小化（将textarea的类设置回正常值）

我可以让它工作，但反过来不行

这是我的HTML+Javascript

<!DOCTYPE html>

<html>

<head>

<style type="text/css">
.normal {
    width: 400px;
    height: 25px;

}
.expand {
    height: 400px;
    width: 400px;
}
</style>

<script type="text/javascript">
function expand() {

document.getElementById('subject_area').className = "expand"

document.getElementById('expand').value = "minimize"


}
</script>

</head>

<body>
<input class="normal" id="subject_area" type="textarea" >
<input id="expand" type="button" value="expand" onclick="expand()">
</body>

</html>


.正常{
宽度：400px；
高度：25px；
}
.扩大{
高度：400px；
宽度：400px；
}
函数展开（）{
document.getElementById（'subject_area'）。className=“expand”
document.getElementById（'expand'）.value=“最小化”
}

您可以执行以下操作：

var subject = document.getElementById('subject_area');
var btnExpand = document.getElementById('expand');
subject.className == "expand" ? subject.className = "normal" : subject.className = "expand";
btnExpand.value == "minimize" ? btnExpand.value = "expand" : btnExpand.value = "minimize";

在这里拉小提琴：

var subject = document.getElementById('subject_area');
var button = document.getElementById('expand');

function expand() {
    if (subject.className === 'normal') {
        subject.className = 'expand';
        button.value = 'minimize';
    } else {
        subject.className = 'normal';
        button.value = 'expand';
    }
}