Membuat Tombol Hide & Show (spoiler)

Mungkin anda ingin menyembunyikan sebagian artikel dengan tombol hide show...? Agar artikel terlihat tidak terlalu banyak anda bisa gunakan script spoiler mau tau caranya mari kita belajar bersama...

<div> <input value="Tampilkan" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Sembunyikan&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div> <div class="alt2"> <div style="display: none;"> <div style="background:#000000;text-align:left;padding:10px;color:#ffffff;"> Masukkan text-nya disini. Gambar juga bisa. </div> </div> </div>

Hasilnnya seperti di bawah ini

Perhatikan text yang saya cetak berwarna merah dan biru, anda dapat mengubah / mengedit text yang saya cetak berwarna merah dan biru selamat mencoba.

Semoga bermanfaat. Ingat ya, perhatikan yang berwarna merah dan biru kalau ingin mengedit-nya sekali lagi semoga bermanfaat.