Mengatur Gaya Komputasi HTML Menggunakan getComputedStyle DOM
Sebelum memahami lebih dalam materi tentang Mengatur Gaya Komputasi HTML Menggunakan getComputedStyle DOM, terlebih dahulu pelajari materi tentang: Membuat Tombol Oke dan Cancel HTML Menggunakan Confirm Window DOM, Mengatur Waktu HTML clearTimeout dan clearInterval Window DOM, dan Melakukan Encoding HTML Menggunakan Btoa Window DOM.
Sintak: window.getComputedStyle(element, pseudoElement)
Properti Parameter:
- element: berfungsi untuk mendapatkan nilai style komputasi.
- pseudoElement: merupakan parameter opsional yang digunakan untuk mendapatkan nilai elemen-peseudo.
<!DOCTYPE html>
<html>
<head>
<title>
Properti Window
getComputedStyle() DOM pada
HTML
</title>
<style>
div
{
color: white;
text-align: justify;
}
</style>
</head>
<body>
<center>
<p>
<button
onclick="myFunction()">
Try it
</button>
</p>
<div
id="test"
style="height: 100px;
background-color: green;
font-size: 50px;
padding-left: 140px;
padding-top: 50px;">
Blog Elfan
</div>
<p>
Komputasi font-family dari
teks pada elemen div adalah:
<span id="demo"></span>
</p>
<script>
function myFunction()
{
var elem = document.getElementById("test");
var theCSSprop =
window.getComputedStyle(
elem, null).getPropertyValue("font-family");
document.getElementById("demo").innerHTML =
theCSSprop;
}
</script>
</center>
</body>
</html>
- Perintah Prompt HTML Menggunakan Prompt Window DOM
- Mengatur Ukuran Halaman HTML Menggunakan resizeBy Window DOM
- Mengatur Ukuran Halaman HTML Menggunakan resizeTo Window DOM
- Melakukan Gulir HTML Menggunakan scrollTo Window DOM
- Mengatur Waktu HTML Menggunakan setTimeout dan setInterval Window DOM
- Menghentikan Layar HTML Menggunakan Stop Window DOM
- Membuat Kunci Penyimpanan HTML Menggunakan Storage Key DOM
6 komentar untuk "Mengatur Gaya Komputasi HTML Menggunakan getComputedStyle DOM"
Hubungi admin melalui Wa : +62-896-2414-6106
Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.
Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.
- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti getcomputedstyle DOM pada HTML?
BalasHapusBerikut ini diperlihatkan beberapa contoh browser untuk mengaktifkan properti getcomputetStyle DOM pada HTML:
Hapus11. Google Chrome 11.0
22. Internet Explorer 9.0
33. Firefox 4.0
44. Opera 11.5
55. Safari 5
Apa yang dimaksud dengan method getComputedStyle() DOM pada HTML?
BalasHapusMethod getComputedStyle() DOM pada HTML merupakan method properti yang digunakan untuk mengembalikan nilai object yang berisi nilai dari semua properti CSS dari suatu elemen, setelah menerapkan stylesheet aktif dan menyelesaikan perhitungan dasar apapun yang mungkin ada pada nilai tersebut.
HapusMethod getComputedStyle() DOM pada HTML merupakan properti yang mendapatkan nilai properti dan nilai CSS yang dihitung dari nilai elemen HTML.
HapusMethod getComputedStyle() adalah properti yang digunakan untuk mengembalikan nilai object CSSStyleDeclaration.
Hapus