Haii.. sobat Hots WEB, Daftar atribut-atribut dibawah ini adalah atribut-atribut
standard yang dapat digambarkan untuk elemen-elemen HTML.
Atribut-atribut standard terbagi tiga kelompok, Atribut Core, Atribut Language, dan Atribut Event.
Atribut Core
Atribut-atribut core tidak boleh digambarkan untuk elemen
BASE, HEAD, HTML, META, PARAM, SCRIPT, STYLE, dan TITLE. Atribut-atribut core
antara lain CLASS, ID, STYLE, dan TITLE.
Atribut CLASS digunakan untuk menetapkan nama kelas untuk
elemen-elemen HTML, nantinya aturan CSS dengan class selectornya dapat mengacu
kepada nilai dari atribut CLASS elemen-elemen HTML yang terkait.
Contoh:
<HTML>
<HEAD>
<STYLE TYPE="text/css">
P.kelas {
color:blue;
}
</STYLE>
</HEAD>
<BODY>
<P CLASS="kelas">Alinea</P>
</BODY>
</HTML>
Atribut ID digunakan untuk menetapkan pengenal unik untuk
sebuah elemen HTML, nantinya aturan CSS dengan Id selectornya dapat mengacu
kepada nilai dari atribut ID sebuah elemen HTML. Nilai atribut ID adalah unik.
Ini menggambarkan bahwa satu elemen dengan dengan elemen HTML lainnya tidak
boleh memiliki nilai atribut ID yang sama, beda dengan atribut CLASS!
Contoh:
<HTML>
<HEAD>
<STYLE TYPE="text/css">
P#id {
color:blue;
}
</STYLE>
</HEAD>
<BODY>
<P ID="id">Alinea</P>
</BODY>
</HTML>
Atribut STYLE digunakan untuk menerapkan aturan CSS langsung
didalam tag awal dari elemen-elemen HTML yang terkait.
Contoh:
<HTML>
<BODY>
<P STYLE="color:red">merah</P>
<P STYLE="color:blue">biru</P>
</BODY>
</HTML>
Atribut TITLE digunakan untuk memberikan ekstra informasi
tambahan berupa teks untuk sebuah elemen HTML. Nilai atribut TITLE ini akan
ditampilkan sebagai tooltip, yaitu ketika pointer mouse tepat diatas sebuah
elemen. Atribut TITLE sangat penting untuk elemen A, IMG, ABBR, dan ACRONYM.
Contoh:
<HTML>
<BODY>
<P>Saya kuliah di jurusan<ABBR TITLE="Teknik
Informatika">TI</ABBR></P>
</BODY>
</HTML>
Atribut Language
Atribut-atribut language tidak boleh digambarkan untuk
elemen BASE, BR, FRAME, FRAMESET, HR, IFRAME, PARAM, dan SCRIPT.
Atribut-atribut language antara lain DIR dan LANG.
Atribut DIR digunakan untuk menggambarkan arah-arah
penulisan untuk isi didalam sebuah elemen HTML. Apakah arah penulisannya dari
arah kiri ke kanan ("ltr") atau dari arah kanan ke kiri
("rtl").
Contoh:
<HTML>
<BODY>
<P LANG="id" DIR="ltr">teks rata
kanan</P>
<P LANG="id" DIR="rtl">teks rata
kiri</P>
</BODY>
</HTML>
Atribut LANG digunakan untuk menetapkan kode bahasa untuk
isi didalam sebuah elemen HTML. Untuk nilai dari atribut LANG ini, anda dapat
lihat di ID-ID Bahasa HTML.
Atribut Event
Berikut adalah daftar dari atribut-atribut event yang dapat
digambarkan untuk elemen-elemen HTML:
Atribut event ONCLICK digunakan untuk menetapkan bahwa
sebuah script akan dijalankan ketika pengguna mengklik dengan mouse pada sebuah
elemen.
Contoh:
<HTML>
<BODY>
<INPUT TYPE="button" VALUE="Klik!"
ONCLICK="javascript:alert('Event ONCLICK dipanggil')">
</BODY>
</HTML>
Atribut event ONDBLCLICK digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika pengguna mengklik dua kali
dengan mouse pada sebuah elemen.
Contoh:
<HTML>
<BODY>
<INPUT TYPE="button" VALUE="Klik!"
ONDBLCLICK="javascript:alert('Event ONDBLCLICK dipanggil')">
</BODY>
</HTML>
Atribut event ONMOUSEDOWN digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika tombol mouse ditekan.
Contoh:
<HTML>
<BODY>
<INPUT TYPE="button" VALUE="Klik!"
ONMOUSEDOWN="javascript:alert('Event ONMOUSEDOWN dipanggil')">
</BODY>
</HTML>
Atribut ONMOUSEMOVE digunakan untuk menetapkan bahwa sebuah
script akan dijalankan oleh browser ketika mouse digerakkan.
Contoh:
<HTML>
<BODY>
<IMG SRC="example.com.gif"
ONMOUSEMOVE="alert('Menuju ke Example.com!')">
</BODY>
</HTML>
Atribut event ONMOUSEOUT digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika mouse digerakkan keluar dari
sebuah elemen.
Contoh:
<HTML>
<BODY>
<IMG SRC="example.com.gif"
ONMOUSEOUT="alert('Menuju ke Example.com!')">
</BODY>
</HTML>
Atribut event ONMOUSEOVER digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika mouse digerakkan tepat diatas
sebuah elemen.
Contoh:
<HTML>
<BODY>
<IMG SRC="example.com.gif"
ONMOUSEOVER="alert('Menuju ke Example.com!')">
</BODY>
</HTML>
Atribut event ONMOUSEUP digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika tombol mouse dilepaskan,
setelah sebelumnya tombol mouse ditekan.
Contoh:
<HTML>
<BODY>
<IMG SRC="example.com.gif"
ONMOUSEUP="alert('Menuju ke Example.com!')">
</BODY>
</HTML>
Atribut event ONKEYDOWN digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika sebuah tombol keyboard
ditekan.
Contoh:
<HTML>
<BODY>
<SCRIPT TYPE="text/javascript">
function bukanAngka(e){
var keyAngka;
var keyKarakter;
var cekAngka;
if(window.event){//IE
keyAngka = e.keyCode;
}else if(e.which) {//Netscape/Firefox/Opera
keyAngka = e.which;
}
keyKarakter = String.fromCharCode(keyAngka);
cekAngka = /d/;
return !cekAngka.test(keyKarakter);
}
</SCRIPT>
<FORM>
Ketikkan hanya teks bukan angka:
<INPUT TYPE="text" ONKEYDOWN="return
bukanAngka(event)">
</FORM>
</BODY>
</HTML>
Atribut event ONKEYUP digunakan untuk menetapkan bahwa
sebuah script akan dijalankan oleh browser ketika tombol keyboard dilepaskan,
setelah sebelumnya ditekan.
Contoh:
<HTML>
<HEAD>
<SCRIPT TYPE="text/javascript">
function hurufBesar(x){
var y=document.getElementById(x).value;
document.getElementById(x).value=y.toUpperCase();
}
</SCRIPT>
</HEAD>
<BODY>
Nama: <INPUT TYPE="text" ID="nama"
ONKEYUP="hurufBesar(this.id)">
</BODY>
</HTML>
Sekian Terima Kasih, Semoga Bermanfaat..