Contoh Penerapan Object String JavaScript

Selamat Sore,

Artikel ini merupakan kelanjutan dari artikel sebelumnya yang membahasa tentang Object String pada JavaScript.
Jika anda belum membanya, saya sarankan anda untuk melihat artikel berikut tentang Object String Pada JS agar anda lebih memahami contoh berikut.

Okey, langsung saja saya bagikan contoh penerapanny.

Object String :

<html>
<head>
<script>
function Hitung(){
    var str = document.getElementById('test').innerHTML;
    var n = str.length;
    document.getElementById('test').innerHTML = n;
}

function Ganti(){
    var str = document.getElementById('test1').innerHTML;
    var n = str.replace("string","Text");
    document.getElementById('test1').innerHTML = n;
}

function Ambil(){
    var str = document.getElementById('test2').innerHTML;
    var n = str.substr('16','8');
    document.getElementById('test2').innerHTML = n;
}

function Ambil1(){
    var str = document.getElementById('test3').innerHTML;
    var n = str.substring('6','15');
    document.getElementById('test3').innerHTML = n;
}

function LowStr(){
    var str = document.getElementById('test4').innerHTML;
    var n = str.toLowerCase();
    document.getElementById('test4').innerHTML = n;
}

function UpStr(){
    var str = document.getElementById('test5').innerHTML;
    var n = str.toUpperCase();
    document.getElementById('test5').innerHTML = n;
}
</script>
</head>

<body>
<p id="test">Test panjang karakter "Hello World!"</p>
Menghitung jumlah karakter di dalam string :<br />
<button onclick="Hitung()">Lihat</button><br />
<br />
<p id="test1">Test replace "Ganti string"</p>
Mengganti karakter di dalam string :<br />
<button onclick="Ganti()">Lihat</button><br />
<br />
<p id="test2">Test "Mengambil beberapa teks didalam string"</p>
Mengambil beberapa teks didalam string :<br />
<button onclick="Ambil()">Lihat</button><br />
<br />
<p id="test3">Test "Mengambil beberapa teks dengan batas tertentu"</p>
Mengambil beberapa teks didalam string :<br />
<button onclick="Ambil1()">Lihat</button><br />
<br />
<p id="test4">KONVERSI KE HURUF KECIL</p>
Test konversi huruf besar :<br />
<button onclick="LowStr()">Lihat</button><br />
<br />
<p id="test5">Konversi ke huruf besar</p>
Test konversi huruf besar :<br />
<button onclick="UpStr()">Lihat</button><br />
</body>
</html>

Output code diatas adalah :

Test panjang karakter "Hello World!"
Menghitung jumlah karakter di dalam string :


Test replace "Ganti string"
Mengganti karakter di dalam string :


Test "Mengambil beberapa teks didalam string"
Mengambil beberapa teks didalam string :


Test "Mengambil beberapa teks dengan batas tertentu"
Mengambil beberapa teks didalam string :


KONVERSI KE HURUF KECIL
Test konversi huruf besar :


Konversi ke huruf besar
Test konversi huruf besar :


Berikut penggunaan sederhana dari String HTML Wrapper Methods

<html>
<head>
<title>Contoh String adalah 'Test Js HTML Wrapper'</title>
</head>
<body>
<script>
var txt = 'Test Js HTML Wrapper';

document.write('<p>Anchor : '+txt.anchor()+'</p>');
document.write('<p>Big : '+txt.big()+'</p>');
document.write('<p>Small : '+txt.small()+'</p>');
document.write('<p>Bold : '+txt.bold()+'</p>');
document.write('<p>Italics : '+txt.italics()+'</p>');
document.write('<p>Big : '+txt.big()+'</p>');
document.write('<p>Fixed : '+txt.fixed()+'</p>');
document.write('<p>Strike : '+txt.strike()+'</p>');
document.write('<p>Font Color : '+txt.fontcolor('#f00')+'</p>');
document.write('<p>Font Size : '+txt.fontsize(5)+'</p>');
document.write('<p>SubScript : '+txt.sub()+'</p>');
document.write('<p>Super Script : '+txt.sup()+'</p>');
document.write('<p>Link : '+txt.link('http://fb.me/awal.samsu')+'</p>');
document.write('<p>Blink : '+txt.blink()+'</p>');
</script>
</body>
</html>

Output code diatas adalah :

Mungki cukup ini dulu, karena keterbatasan ilmu penulis yang maih dasar dan awam dalam JS.
Thank's ^_^

1 komentar :

tombol share icon
tombol kembali ke atas
Wait . . . !!!
tampilan ads aktif