HTML :: 내용 접기 구현방법

간단한 페이지를 만들다보면 가끔 내용접기 기능이 필요할 때가 있어서 정리해본다.

<a onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" href="javascript:void(0)" style="text-decoration:none"><h4>+ Hashing program</h4>
</a><div style="DISPLAY: none">
<form method="post" action="#">
        <input type="text" placeholder="Input text to hash" name="plaintext" />
        <input type="submit" value="Hash!" />
</form>
</div>

나의 경우는 위와같이 해시 프로그램을 구동하기 위해 평문을 POST 방식으로 보내는 태그들을 div로 묶어 숨겼다.