Loading...

Cara Menampilkan Output Java Script

Output merupakan sebuah tampilan akhir yang di hasilkan dari sebuah codingan atau kode yang di buat, biasanya output di tampilkan dalam bentuk teks dengan memberikan fungsi print

Untuk menampilkan output pada javascript ada 4 metode yang bisa di gunakan yaitu.

  1.     Menggunakan Fungsi console.log();
  2.     Menggunakan Fungsi alert();
  3.     Menggunakan Fungsi document.write();
  4.     Menggunakan innerHTML.

1. Fungsi console.log()

Fungsi console.log() merupakan fungsi menampilkan teks ke console javascrip, fungsi console.log() biasa di gunakan untuk proses debugging dan akan menampilkan setiap pesan error di console. Selain itu kamu juga bisa menggunakan console.debug(), console.info(), console.error(), console.dir()dan fungsi tersebut dapat juga di guanakan pada nodejs.


Untuk contoh penggunaanya bisa kamu lihat di bawah ini.
console.log("Hello World!");

2. Mengenal Fungsi alert()

Fungsi alert() ialah untuk menampilkan jendela dialog, fungsi sebenarnya berada pada objek window. Untuk penulisannya ada dua cara yaitu.
window.alert("Hello World!");

atau bisa juga dengan menggunakan alert saja.

alert("Hello World!");

Berikut adalah contoh penggunaan alert().

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Belajar Javascript</title>
    <script>
        alert("Selamat datang di tutorial belajar Javascript");

        function sayHello(){
            alert("Hello!");
        }
    </script>
</head>
<body>
    <button onclick="sayHello()">Klik Aku!</button>
</body>
</html>


3. Mengenal Fungsi document.wirite()

Objek dokument yaitu objek yang mewakili HTML di dalam javascript, dalam objek tersebut terdapat fungsi write untuk menulis sesuatu ke dalam dokumen html.

Contohnya seperti di bawah ini.
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Belajar Javascript</title>
    <script>
        document.write("<h1>Hello World!</h1>");
        document.write("<hr>");
        document.write("<p>Saya sedang belajar Javascript</p>");
        document.write("di <b>hidayatcode.com</b>")
    </script>
</head>
<body>

</body>
</html>

4. Mengenal Fungsi innerHTML

innerHTML merupakan sebuah atribut di dalam objek elemen HTML yang berisi string HTML, contohnya seperti di bawah ini.
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Belajar Javascript</title>
</head>
<body>

    <h1>Tutorial Javascript untuk Pemula</h1>
    <div id="hasil-output"></div>


    <script>
        // membuat objek elemen
        var hasil = document.getElementById("hasil-output");

        // menampilkan output ke elemen hasil
        hasil.innerHTML = "<p>Aku suka Javascript</p>";
    </script>

</body>
</html>
Itulah empat fungsi yang bisa kamu gunakan di dalam javascript.

IT Enthusiast

Posting Komentar