HTMLStyleElement

HTMLStyleElement merepresentasikan elemen STYLE HTML.

Sintaks untuk mengakses properti HTMLStyleElement:

document.all.ID.property document.getElementById("ID").property

Sintaks untuk mengakses metode HTMLStyleElement:

document.all.ID.method([parameters]) document.getElementById("ID").method([parameters])

Properti:

• disabled
  Menetapkan atau mengembalikan atribut DISABLED elemen STYLE HTML.
• media
  Menetapkan atau mengembalikan atribut MEDIA elemen STYLE HTML.
• type
  Menetapkan atau mengembalikan atribut STYLE elemen STYLE HTML.

Untuk mengetahui banyaknya elemen STYLE dan LINK (LINK yang digunakan melink dokumen CSS eksternal ke dalam dokumen), anda bisa gunakan pola di bawah ini:

var numbersOfStyleObj = document.styleSheets.length;

Dengan melibatkan properti styleSheets[], dan cssRules[]/rules[] dimungkinkan mengakses elemen STYLE tertentu dan deklarasi CSS di dalamnya. Sebagai contoh salah satu dari kedua kode di bawah ini digunakan untuk merefensi kepada deklarasi CSS pertama di dalam elemen STYLE:

var oneRule = document.styleSheets[0].rules[0]; // IE4+, MacIE5, Safari var oneRule = document.styleSheets[0].cssRules[0]; // NN6+/Moz, MacIE5, Safari

Misalkan ada 1 elemen STYLE, 1 elemen P di dalam dokumen:

<STYLE TYPE="text/css"> P { color: red; } </STYLE> ... <P>Ini adalah alinea.</P>

Selanjutnya ingin memodifikasi nilai-nilai deklarasi dari selector P di dalam elemen STYLE ke nilai-nilai baru, contohnya seperti berikut, misalnya:

document.styleSheets[0].cssRules[0].style.color = "blue";

Seharusnya elemen P akan berwarna merah untuk teksnya, dengan menambahkan sintaks di atas, maka teks dari elemen P adalah berwarna biru.

Tetapi yang sering umum dijumpai adalah penggunaan sintaks di bawah ini untuk langsung memberikan style terhadap elemen tertentu secara langsung:

document.getElementById("elemID").style.cssProperty = "value";

Untuk elemID adalah ID elemen yang ingin diberikan style, dan untuk cssProperty = "value" adalah properti CSS yang telah dimodifikasi (misalnya properti background-color menjadi backgroundColor) beserta nilainya.

Untuk referensi lengkapnya, silahkan ke halaman Daftar Properti CSS di dalam Sintaks JavaScript.