Jquery The Basic Part 07 : Jquery selector .Children .eq() and .next()

Halo Sob, sekarang kita akan ngebahas materi tentang fungsi .eq() yang hampir sama dengan nth-child, namun kalau kita pakai .eq() itu dimulai dari 0 untuk id pertamanya. Dan kita juga akan belajar menggunakan fungsi .next() yaitu fungsi yang digunakan untuk menunjukan id atau elemen terpilih  berikutnya.


Pertama buat dulu style css dafaultnya :

<style>
 li { color: black;}
 </style>

setelah itu kita buat elemen tag <ul> dan <li> :

<ul class="change">
 <li>item</li>
 <li>item 2</li>
 <li>
 <ul>
 <li>hello from the nest.</li>
 </ul>
 </li>
 </ul>

terakhir kita sisipkan library jquery dan script jquery dengan menggunakan fungsi .eq(0) artinya yaitu untuk memberi style pada li yang pertama, dan adapun untuk .next untuk memberi style pada li berikutnya :

 <script src="jquery.js"></script>
 <script>
 $('ul.change').children('li').eq(0).text('Hello Word');
 $('ul.change').children('li').eq(0).next().text('Hello Word 2');
</script>

Selamat Mencoba :D


>> Download File <<

Tweet