Merubah Text menjadi HTML Entity dengan Javascript

Kali ini Nubie akan membagikan ke kamu cara merubah text biasa menjadi sebuah HTML Entity atau HTML Entities.


Apa itu HTML Entity ?

HTML Entity adalah sepotong teks ("string") yang dimulai dengan ampersand (&) dan diakhiri dengan titik koma (;). HTML Entities sering digunakan untuk menampilkan karakter yang dicadangkan (yang sebaliknya akan ditafsirkan sebagai kode HTML), dan karakter yang tidak terlihat (seperti spasi yang tidak terputus). Kamu juga dapat menggunakannya sebagai pengganti karakter lain yang sulit diketik dengan keyboard standar.


Aplikasi Sederhana JS : Text menjadi HTML Entity



Kamu dapat merubah suatu text ataupun script yg sebelumnya tampak biasa saja menjadi sebuah entitas HTML yang disebut sebagai HTML Entity. HTML Entity ini nantinya akan merubah setiap entitas yang memiliki karakter pengganti HTML. 

Penggunaan HTML Entity ini lebih aman digunakan untuk sebuah postingan. Karena entitas ini menerjemahkan semua huruf ataupun tanda baca menjadi text code yang hanya dapat dibaca html


Source Code

Berikut ini adalah script yang Nubie gunakan untuk membuat Tools merubah Text menjadi HTML Entity diatas.

<button class="btn btn-danger" id="cButton" onclick="ConvertToHTMLEntities()" type="button" value="Convert"><svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-edit"></use></svg> Convert</button>

<p><label>Text Asal</label><textarea class="form-control" id="postText" onclick="this.focus();this.select()" rows="20" style="min-width: 100%;"></textarea></p>

<p><label>Text yang telah menggunakan HTML Entities</label></p><p><textarea class="form-control" id="HTMLEntitiesText" readonly="readonly" rows="20" style="min-width: 100%;"></textarea></p>

<script type="application/javascript">
function ConvertToHTMLEntities() {
 	var BaseText = document.getElementById("postText");
  	var FinishText = document.getElementById("HTMLEntitiesText");
  
	var encodedStr = BaseText.value.replace(/[\u00A0-\u9999<>\&]/gim, function(i) {
       return '&#'+i.charCodeAt(0)+';';
    });
  
    FinishText.value = encodedStr.replace(/&/gim, '&');
}
</script>

Next Post Previous Post