Pengertian Dhtml Dan Fungsinya
Pengertian DHTML dan Fungsinya - DHTML atau Dynamic HTML, bukan bahasa pemrograman melainkan sebuah istilah untuk menciptakan halaman web dinamis dan interaktif dengan menggabungkan HTML, JavaScript, Document Object Model, dan CSS markup languages.
DHTML memungkinkan skrip bahasa pemrograman diubah menjadi variabel pada setiap definisi halaman bahasa pemrograman, yang menghasilkan perubahan pengaruh tampilan beserta fungsinya sesudah halaman web ditampilkan.
Berbeda dengan HTML, yang mempunyai kemampuan untuk menghasilkan dan memproses halaman web sebelum ditampilkan.
Baca juga:
Pengertian HTML dan Fungsinya
Pengertian HTML5 dan Fungsinya
Pengertian XHTML dan Fungsinya
Penggunaan DHTML
DHTML biasanya dipakai untuk menciptakan tombol rollover atau sajian drop-down interaktif dan halaman web.
Beberapa teknologi aplikasi peramban web mempunyai tingkat kontribusi yang berbeda untuk DHTML sehingga sangat sulit untuk dikembangkan.
Seperti variasi dan kombinasi ukuran layar sanggup ditampilkan dengan baik pada beberapa aplikasi peramban web sementara yang lain tidak.
Perkembangan yang relatif gres dari setiap aplikasi browser web menyerupai Internet Explorer 5.0+, Mozilla Firefox 2.0+, dan Opera 7.0+ telah menambahkan Document Object Model. uji
Struktur pada halaman web
Pada dasarnya halaman web diatur menyerupai ini:
<! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> Contoh DHTML </ title>
</ head>
<body>
<div id = "navigasi"> </ div>
<script>
var init = function () {
myObj = document.getElementById ("navigasi");
// ... memanipulasi myObj
};
window.onload = init;
</ script>
<! -
Meskipun isyarat tersebut tersimpan pada file eksternal; Hal ini bisa diatasi dengan menciptakan file link yang berisi JavaScript.
Ini mempunyai kegunaan kalau memakai skrip pemrograman yang sama pada beberapa halaman web:
->
<script src = "myj4vascript.js"> </ script>
</ body>
</ html>
Contoh: menampilkan blok teks tambahan
Kode berikut menjelaskan fungsi yang paling sering digunakan. Bagian pemanis pada halaman web hanya akan ditampilkan kalau pengguna menginginkannya.
<! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> Cara memakai fungsi DOM </ title>
<style>
sebuah {background-color: #eee;}
a: hover {background: # ff0;}
# example1 {background: #cfc; layar: tidak ada; margin: 30px 0; padding: 1em;}
</ style>
</ head>
<body>
<h1> Cara memakai fungsi DOM </ h1>
<h2> <a id=" showcase" href="#"> Tampilkan teladan </a> </ h2>
<p id = "contoh1"> Ini ialah sebuah contoh.
(Informasi tambahan, hanya ditampilkan kalau pengguna menginginkannya) ... </ p>
<p> Teks lanjutan ... </ p>
<script>
changeDisplayState = function (id) {
var d = document.getElementById ('show hide'),
e = document.getElementById (id);
kalau (e.style.display === 'none' || e.style.display === '') {
e.style.display = 'blok';
d.innerHTML = 'Sembunyikan contoh';
}
lain {
e.style.display = 'none';
d.innerHTML = 'Tampilkan contoh';
}
};
document.getElementById ('show hide'). onclick = function () {
changeDisplayState ('example1');
kembali salah;
};
</ script>
</ body>
</ html> Sumber http://www.pintarkomputer.org/
DHTML memungkinkan skrip bahasa pemrograman diubah menjadi variabel pada setiap definisi halaman bahasa pemrograman, yang menghasilkan perubahan pengaruh tampilan beserta fungsinya sesudah halaman web ditampilkan.
Berbeda dengan HTML, yang mempunyai kemampuan untuk menghasilkan dan memproses halaman web sebelum ditampilkan.
Baca juga:
Pengertian HTML dan Fungsinya
Pengertian HTML5 dan Fungsinya
Pengertian XHTML dan Fungsinya
Penggunaan DHTML
DHTML biasanya dipakai untuk menciptakan tombol rollover atau sajian drop-down interaktif dan halaman web.
Beberapa teknologi aplikasi peramban web mempunyai tingkat kontribusi yang berbeda untuk DHTML sehingga sangat sulit untuk dikembangkan.
 |
| DHTML |
Seperti variasi dan kombinasi ukuran layar sanggup ditampilkan dengan baik pada beberapa aplikasi peramban web sementara yang lain tidak.
Perkembangan yang relatif gres dari setiap aplikasi browser web menyerupai Internet Explorer 5.0+, Mozilla Firefox 2.0+, dan Opera 7.0+ telah menambahkan Document Object Model. uji
Struktur pada halaman web
Pada dasarnya halaman web diatur menyerupai ini:
<! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> Contoh DHTML </ title>
</ head>
<body>
<div id = "navigasi"> </ div>
<script>
var init = function () {
myObj = document.getElementById ("navigasi");
// ... memanipulasi myObj
};
window.onload = init;
</ script>
<! -
Meskipun isyarat tersebut tersimpan pada file eksternal; Hal ini bisa diatasi dengan menciptakan file link yang berisi JavaScript.
Ini mempunyai kegunaan kalau memakai skrip pemrograman yang sama pada beberapa halaman web:
->
<script src = "myj4vascript.js"> </ script>
</ body>
</ html>
Contoh: menampilkan blok teks tambahan
Kode berikut menjelaskan fungsi yang paling sering digunakan. Bagian pemanis pada halaman web hanya akan ditampilkan kalau pengguna menginginkannya.
<! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> Cara memakai fungsi DOM </ title>
<style>
sebuah {background-color: #eee;}
a: hover {background: # ff0;}
# example1 {background: #cfc; layar: tidak ada; margin: 30px 0; padding: 1em;}
</ style>
</ head>
<body>
<h1> Cara memakai fungsi DOM </ h1>
<h2> <a id=" showcase" href="#"> Tampilkan teladan </a> </ h2>
<p id = "contoh1"> Ini ialah sebuah contoh.
(Informasi tambahan, hanya ditampilkan kalau pengguna menginginkannya) ... </ p>
<p> Teks lanjutan ... </ p>
<script>
changeDisplayState = function (id) {
var d = document.getElementById ('show hide'),
e = document.getElementById (id);
kalau (e.style.display === 'none' || e.style.display === '') {
e.style.display = 'blok';
d.innerHTML = 'Sembunyikan contoh';
}
lain {
e.style.display = 'none';
d.innerHTML = 'Tampilkan contoh';
}
};
document.getElementById ('show hide'). onclick = function () {
changeDisplayState ('example1');
kembali salah;
};
</ script>
</ body>
</ html> Sumber http://www.pintarkomputer.org/
0 Response to "Pengertian Dhtml Dan Fungsinya"
Posting Komentar