Tuesday, 7 November 2017

Memilih Elemen yang Angka Indeksnya Kurang Dari Nilai yang Diberikan Menggunakan Jquery

jQuery :lt() Selector

Contoh

Memilih seluruh elemen <tr> sebelum elemen "tr" yang ke-3.

$("tr:lt(2)")

Defenisi dan Penggunaan

Selektor :lt() adalah untuk memilih elemen dengan index kurang dari angka yang diberikan.

Index dimulai dari angka 0.

Misalnya kita mempunyai struktur kode seperti berikut ini:

<table>
<tr>
<td>Baris 1 Kolom 1</td><td>Baris 1 Kolom 2</td><td>Baris 1 Kolom 3</td>
</tr>
<tr>
<td>Baris 2 Kolom 1</td><td>Baris 2 Kolom 2</td><td>Baris 2 Kolom 3</td>
</tr>
<tr>
<td>Baris 3 Kolom 1</td><td>Baris 3 Kolom 2</td><td>Baris 3 Kolom 3</td>
</tr>
<tr>
<td>Baris 4 Kolom 1</td><td>Baris 4 Kolom 2</td><td>Baris 4 Kolom 3</td>
</tr>
</table>

Dari contoh struktur kode di atas, jika kita misalnya, akan mewarnai latar belakang atau memberi warna background hijau untuk elemen <tr> yang angka indeksnya kurang dari angka 2, maka efeknya, elemen pada urutan indeks 0 dan 1 akan berubah latar belakangnya menjadi warna hijau, dalam hal ini elemen pada baris ke-1 dan ke-2 lah yang akan berubah latar belakangnya menjadi warna hijau. Ingatlah bahwa angka indeks dimulai dari 0 (nol), jadi dari contoh kode di atas, baris ke-1 (warna biru) indeksnya = 0, baris ke-2 (warna coklat) indeksnya = 1, baris ke-3 (warna magenta) indeksnya = 2 dan baris ke-4 (warna ungu) indeksnya = 3.

Tip: Gunakan selektor :gt untuk memilih elemen dengan index lebih dari angka yang diberikan.


Rumus

$(":lt(index)")

Parameter Keterangan
index Harus ada. Menentukan elemen manakah yang hendak dipilih.
Elemen dengan index kurang dari angka yang diberikan yang akan dipilih.

Contoh Penggunaan

$("tr:lt(2)").css("background-color", "green");

Mewarnai latar belakang dari seluruh elemen "tr" yang indexnya kurang dari "2". Index dihitung dari angka 0.

Anda bisa langsung mengedit isi dari kode-kode di atas dan melihat perubahannya.

Hasilnya:

Cobalah untuk mengganti angka indeksnya, dan lihatlah perubahannya.

Memilih Elemen yang Angka Indeksnya Kurang Dari Nilai yang Diberikan Menggunakan Jquery Rating: 4.5 Diposkan Oleh: ChooLebeharia