Mendapatkan Lebar Offset HTML Menggunakan offsetWidth DOM
 |
| Ilustrasi offsetWidth DOM HTML |
element.offsetWidth
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style offsetWidth
DOM
</title>
<style>
#MKN
{
height: 150px;
width: 300px;
padding: 10px;
margin: 15px;
background-color: green;}
</style>
</head>
<body>
<h2>
Properti Style offsetWidth
DOM
</h2>
<div id="MKN">
<b>
Informasi tentang div:
</b>
<p id="demo"></p>
</div>
<button
type="button"
onclick="Bons()">
Submit
</button>
<script>
function Bons()
{
var element = document.getElementById("MKN");
var txt = "Width including"
+ " padding and border: "
+ element.offsetWidth
+ "px";
document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>
Properti Style offsetWidth DOM
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style offsetWidth
DOM
</title>
<style>
#MKN
{
height: 150px;
width: 300px;
padding: 10px;
margin: 15px;
background-color: green;}
</style>
</head>
<body>
<h2>
Properti Style offsetWidth
DOM
</h2>
<div id="MKN">
<b>
Informasi tentang div:
</b>
<br>
<p id="demo"></p>
</div>
<button
type="button"
onclick="Bons()">
Submit
</button>
<script>
function Bons()
{
var element = document.getElementById("MKN");
var txt = "";
txt += "Width with "
+ "padding: "
+ element.clientWidth
+ "px<br>";
txt += "Width with "
+ "padding and border: "
+ element.offsetWidth
+ "px";
document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>
Properti Style offsetWidth DOM
- Cara Penggunaan Properti parentNode DOM pada HTML [klik]
- 2 Contoh Penggunaan Properti parentElement DOM pada HTML [klik]
- Cara Penggunaan Properti previousSibling DOM pada HTML [klik]
- Cara Penggunaan Properti previousElementSibling DOM pada HTML [klik]
- Cara Penggunaan Method querySelectorAll() DOM pada HTML [klik]
- Cara Penggunaan Method removeAttribute() DOM pada HTML [klik]
- Cara Penggunaan Method removeAttributeNode() DOM pada HTML [klik]
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti offsetWidth() DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan method offsetWidth() DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa yang dimaksud dengan properti offsetWidth DOM pada HTML?
BalasHapusProperti offsetWidth DOM pada HTML berfungsi untuk mengembalikan ukuran lebar elemen yang dapat dilihat oleh user dalam satuan pixel, yang juga termasuk ukuran padding, border, dan scrollbar jika ada, tetapi tidak termasuk ukuran margin.
HapusProperti offsetWidth merupakan ukuran dalam pixel dari lebar CSS pada suatu elemen, yang termasuk ukuran border, padding, dan scrollbar vertikal jika ada atau sedang dirender.
Hapus