html,CSS - 더보기, 숨기기 코드

<div> <input value="더보기" onclick=" if(this.parentNode.getElementsByTagName('div')[0].style.display != '') {this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = '숨기기';} else {this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = '더보기';}" type="button" /> <div style="display: none;"> 내용을 작성해주세요. </div> </div>

 

value="더보기" => 초기 버튼 문구입니다.

​

style="display: none; => 첫 화면에서 내용이 보이지 않도록 해줍니다.

​

더보기와 내용 순서를 바꾸면 화면상의 위치도 바뀝니다!