2 Contoh Penggunaan Properti offsetHeight DOM pada HTML

Properti offsetHeight DOM pada HTML digunakan untuk mengembalikan layout height dari elemen sebagai nilai integer atau bilangan bulat. Properti offsetHeight diukur dalam satuan pixel, yang termasuk bidang pengukurannya adalah height, border, padding, dan scrollbar horizontal tapi bukan margin. Jika elemen yang diukur oleh properti offsetHeight disembunyikan maka akan mengembalikan nilai 0.

Sintak:
element.offsetHeight

Return Value: berfungsi untuk mengembalikan layout height dari elemen sebagai nilai bilangan bulat.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

Properti Style offsetHeight 

DOM

</title>

 

<style>

#MKN 

{

height: 150px;

width: 300px;

padding: 10px;

margin: 15px;

background-color: green;}

</style>

</head>

 

<body>

 

<h2>

Properti offsetHeight DOM

</h2>

 

<div id="MKN">

<b>

Informasi tentang div:

</b>

<p id="sudo"></p>

</div>

 

<button 

type="button" 

onclick="Bons()">

Submit

</button>

 

<script>

function Bons() 

{

var element = document.getElementById("MKN");

 

var txt = "Height termasuk"

+ "juga padding dan border: "

+ element.offsetHeight 

+ "px";

 

document.getElementById("sudo").innerHTML = txt;

}

</script>

 

</body>

 

</html>

Output:

Properti offsetHeight DOM

Informasi tentang div:



Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

Properti Style offsetHeight 

DOM

</title>

 

<style>

#MKN 

{

height: 150px;

width: 300px;

padding: 10px;

margin: 15px;

background-color: green;}

</style>

</head>

 

<body>

 

<h2>

Properti offsetHeight DOM

</h2>

 

<div id="MKN">

 

<b>

Informasi tentang div:

</b>

 

<br>

 

<p id="sudo"></p>

 

</div>

 

<button 

type="button" 

onclick="Bons()">

Submit

</button>

 

<script>

function Bons() 

{

var element = document.getElementById("MKN");

 

var txt = "";

 

txt += "Height with padding: "

+ element.clientHeight 

+ "px<br>";

 

txt += "Height with padding"

+ " and border: "

+ element.offsetHeight 

+ "px";

 

document.getElementById("sudo").innerHTML = txt;

}

</script>

 

</body>

 

</html>

Output:

Properti offsetHeight DOM

Informasi tentang div:

Komentar

  1. Jenis browser apa saja yang dapat digunakan untuk mengaktifkan method offsetHeight() DOM pada HTML?

    BalasHapus
    Balasan
    1. Berikut adalah beberapa browser yang dapat digunakan untuk mengaktifkan properti offsetHeight DOM pada HTML:
      1. Google Chrome
      2. Internet Explorer
      3. Firefox
      4. Opera
      5. Safari

      Hapus
  2. Apa fungsi properti offsetHeight DOM pada HTML?

    BalasHapus
    Balasan
    1. Properti read-only offsetHeight DOM pada HTML berfungsi untuk mengembalikan nilai ketinggian pada suatu elemen, termasuk nilai padding vertikal, dan border sebagai nilai bilangan bulat. Properti offsetHeight merupakan bentuk pengukuran dalam elemen pixel height CSS, yang juga termasuk ukuran dalam padding, berder, dan scrollbar horizontal jika dilakukan render.

      Hapus
    2. Properti offsetHeight merupakan properti DOM HTML yang digunakan oleh bahasa pemrograman JavaScript. Properti ini berfungsi untuk mengembalikan ketinggian elemen yang terlihat dalam pixel yang mencakup ukuran tinggi konten yang visible, border, padding, dan scrollbar jika ada. Penggunaan properti offsetHeight sering digunakan bersamaan dengan properti offsetWidth.

      Hapus

Posting Komentar

*Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung. :D

*Jika terdapat typo, link bermasalah, dan lain sebagainya, pengunjung dapat melaporkan permasalahan tersebut melalui WA: +62-896-2514-6106




~ Ikatlah Ilmu dengan Memostingkannya ~

Referensi Tambahan:

Enkapsulasi pada Java

2 Jenis Utama Kegiatan Penelitian Berdasarkan Waktunya, Crosssectional Salah Satunya

6 Contoh Program Method Overloading pada Java

3 Jenis Utama Looping pada Java

Perbedaan stdio.h dan stdlib.h pada Bahasa C