Senin, 24 Juni 2013

Tandai kata menggunakan regex


Belajar Regex pusing banget tapi kalau udah jadi tuh rasanya seneng banget, kali ini aku mau share hal yang sebenarnya cuman iseng2 aja, kenapa iseng..?? karena aku masih dalam tahap belajar, belum sepenuhnya mengerti tentang JavaScript. aku udah tes cara ini diblogku dan hasilnya lumayan memuaskan semoga aja gak ada masalah ya hehe soalnya javascript tuh sensitif banget sedikit aja salah bisa kacau semuanya.

CONTOH

Tandai kata, disini saya memanfaatkan tanda # (pagar) dan juga @ (at) untuk menandai kata, jadi ketika kita menulis pada postingan dan menggunakan tanda pagar/at diawal kata maka teksnya akan berubah warna sesuai warna yang telah ditentukan pada cssnya, contoh kita menulis #cinta atau @sayang maka secara otomatis teksnya akan berubah warna jika kita menggunakan javascript ini.

<script type='text/javascript'>
//belajar regex @http://zhinto.blogspot.com/
var a,b;
a=document.getElementsByClassName("post-body")[0];
b=a.innerHTML;
b=b.replace(/(\#[A-Za-z]+)/g,"<span class='hash'>$1</span>");
b=b.replace(/(\@[A-Za-z]+)/g,"<span class='at'>$1</span>");
a.innerHTML = b;
</script>

Jika anda ingin mencoba silahkan simpan kode javascript tersebut diatas kode </body>, jangan lupa untuk menyimpan kode cssnya dibawah ini diatas kode ]]></b:skin>.

.hash {
color: #0032FA;
}
.at {
color: #E414CB;
}

Lalu cobalah menulis kata menggunakan tanda # atau @ diAwal kata seperti pada contoh. perhatikan kode post-body pada javascriptnya, itu adalah kelas dari area postingan kita, paling banyak template blogger masih menggunakan post-body tapi jika template anda sudah dimodifikasi abis-abisan silahkan sesuaikan saja dengan kelas dari area postingan anda.