Cara Menggunakan Event Atribut onLoad pada HTML5

by | Nov 18, 2016 | HTML CSS, Javascript, Tips Trik | 0 comments

Halo teman-teman pada kesempatan kali ini saya akan menjelaskan Cara Menggunakan Event Atribut onLoad pada HTML5. Penggunaan atribut onLoad pada HTML5 tersebut biasanya untuk mengeksekusi JavaScript.

Untuk definisi dan penggunaan atribut onLoad pada HTML5 tersebut adalah atribut yang berfungsi ketika sebuah objek telah dimuat, atribut onLoad sendiri biasanya digunakan dalam tag <body>, elemen untuk sekali mengeksekusi semua konten web termasuk gambar, file CSS dll. Namun, hal itu dapat digunakan oleh tag yang mendukung lainnya.

Atribut onLoad dapat digunakan untuk memeriksa pengunjung tipe browser dan versi browser, dan memuat versi yang tepat dari halaman web berdasarkan informasi. Atribut onload juga dapat digunakan untuk menangani cookie.

Browser yang sudah support dengan event atribut onLoad diantaranya:

  • Google Chrome
  • Internet Explorer / Edge
  • Mozilla Firefox
  • Opera
  • Safari

Contoh penulisan Syntax :

<element onload="script">

Tag yang mendukung atribut onLoad :

  • <body>
  • <frame>
  • <frameset>
  • <iframe>
  • <img>
  • <input type=”image”>
  • <link>
  • <script>
  • <style>

Contoh pemakaian atribut onLoad :

  • Menggunakan onLoad dalam tag <img>
<img src="w3html.gif" onload="loadImage()" width="100" height="132">

<script>
function loadImage() {
    alert("Image is loaded");
}
</script>
  • Menggunakan onLoad untuk menagani cookie (menggunakan “advanced” dari javascript)
<body onload="checkCookies()">

<p id="demo"></p>

<script>
function checkCookies() {
    var text = "";
    if (navigator.cookieEnabled == true) {
        text = "Cookies are enabled.";
    } else {
        text = "Cookies are not enabled.";
    }
    document.getElementById("demo").innerHTML = text;
}
</script>

Semoga bermanfaat.