tutorial pengembangan web terbaru

×

JavaScript Referensi

JavaScript

JS Tali JS Jumlah JS operator JS laporan JS matematika JS Tanggal JS susunan JS boolean JS RegExp JS Global JS Konversi

Browser BOM

Window Navigator Screen History Location

HTML DOM

DOM Dokumen DOM elemen DOM atribut DOM Acara DOM Gaya

HTML benda

<a> <abbr> <address> <area> <article> <aside> <audio> <b> <base> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <cite> <code> <col> <colgroup> <datalist> <dd> <del> <details> <dfn> <dialog> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <footer> <form> <head> <header> <h1> - <h6> <hr> <html> <i> <iframe> <img> <ins> <input> button <input> checkbox <input> color <input> date <input> datetime <input> datetime-local <input> email <input> file <input> hidden <input> image <input> month <input> number <input> password <input> radio <input> range <input> reset <input> search <input> submit <input> text <input> time <input> url <input> week <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <s> <samp> <script> <section> <select> <small> <source> <span> <strong> <style> <sub> <summary> <sup> <table> <td> <th> <tr> <textarea> <time> <title> <track> <u> <ul> <var> <video>

Objek lainnya

CSSStyleDeclaration

HTML DOM getElementsByClassName() Method

<Document Object

Contoh

Dapatkan semua elemen dengan nama kelas yang ditentukan:

var x = document.getElementsByClassName("example");

Cobalah sendiri "

Lebih "Try it Yourself" contoh di bawah ini.

Definisi dan Penggunaan

The getElementsByClassName() metode mengembalikan koleksi semua elemen dalam dokumen dengan nama kelas yang ditentukan, sebagai objek NodeList.

Objek NodeList merupakan kumpulan node. Node dapat diakses oleh angka indeks. indeks dimulai dari 0.

Tip: Anda dapat menggunakan panjang milik objek NodeList untuk menentukan jumlah elemen dengan nama kelas tertentu, maka Anda dapat loop melalui semua elemen dan ekstrak info yang Anda inginkan.

Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.

metode
getElementsByClassName()	4.0	9.0	3.0	3.1	9.5

Sintaksis

document.getElementsByClassName( classname )

Nilai parameter

Parameter	Mengetik	Deskripsi
classname	String	Wajib. Nama kelas dari elemen yang Anda ingin mendapatkan. Untuk mencari beberapa nama kelas, pisahkan dengan spasi, seperti "test demo" .

Rincian teknis

DOM Versi:	Inti Level 1 Document Object
Kembali Nilai:	Sebuah objek NodeList, mewakili kumpulan elemen dengan nama kelas yang ditentukan. Unsur-unsur dalam koleksi dikembalikan diurutkan seperti yang muncul dalam kode sumber.

Contoh lebih

Contoh

Dapatkan semua elemen dengan baik "example" dan "color" kelas:

var x = document.getElementsByClassName("example color");

Cobalah sendiri "

Contoh

Cari tahu berapa banyak elemen dengan class = "contoh" ada dalam dokumen (menggunakan properti panjang dari objek NodeList):

var x = document.getElementsByClassName("example").length;

Cobalah sendiri "

Contoh

Mengubah warna latar belakang dari semua elemen dengan class = "contoh":

var x = document.getElementsByClassName("example");
var i;
for (i = 0; i < x.length; i++) {
x[i].style.backgroundColor = "red";
}

Cobalah sendiri "

Pages terkait

CSS Tutorial: CSS Selectors

CSS Referensi: CSS .class Selector

HTML DOM Referensi: elemen. getElementsByClassName()

HTML DOM Referensi: className Property

HTML DOM Referensi: classList Property

HTML DOM Referensi: Style Object

<Document Object