Hallo? apa kabar teman-teman semuanya?pada tutorial sebelumnya saya telah sedikit banyak belajar tentang efek-efek yang ada pada jquery, dan sebelum kita mulai tutorial kali ini saya akan sedikit menjelaskan tentang apa itu jquey.
jquery adalah salah satu library dari javascript yang dimana didalamnya terdapat banyak efek yang dapat kita gunakan, dan salah satunya kita akan coba praktekan pada tutorail kali ini yaitu kita akan belajar tntang mengenal fungsi efek after() pada jaquery.
Sebelumnya saya akan menjelaskan tentang fungsi dari efek after ini, fungsi efek after ini ialah untuk menambahakan suatu kontent setelah kontent yang telah kita tentukan sebagai selectornya, untuk lebih jelasnya teman-teman silahkan buat sebuah file dan ketikan script berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>latihan</title> <style> p { background: yellow; } </style> <script src="https://code.jquery.com/jquery-3.2.0.min.js"></script> </head> <body> <p>saya kursu dimana: </p> <script> $( "p" ).after( "<b>dumetschool</b>" ); </script> </body> </html> |
saya akan menjelaskan scriptnya satu per satu, pertama saya membuat sebuah paragraf dengan element p seperti berikut ini :
|
1 |
<p>saya kursu dimana: </p> |
Lalu saya mengatur element p tersebut dengan css seperti berikut ini :
|
1 2 3 |
p { background: yellow; } |
setelah kita mengatur css dan membuat htmlnya sekarang kita akan memanggil library dari jquery yaitu dengan mengetikan script berikut ini :
|
1 |
<script src="https://code.jquery.com/jquery-3.2.0.min.js"></script> |
Disini saya memanggil library tersebut secara online, setelah itu kita akan membuat pengaturan scriptnya dengan menggunakan efek after(), coba teman-teman tambahkan script berikut ini :
|
1 2 3 |
<script> $( "p" ).after( "<b>dumetschool</b>" ); </script> |
Pertama kita menentukan selecrornya yaitu element p dimana element p kita berikan efek after dengan nilai didalamnya dumetschool yang berarti setelah element p tersebut akan tampil tulisan dumet school.
Gimana teman-teman semuanya? cukup mudah bukan? saya kira untuk tutorial kali ini tetang mengenal fungsi efek after() pada jaquery cukup sampai sini dulu, semoga tutorial yang singkat kali ini bermanfaat untuk teman-teman semuanya, sampai bertemu lagi pada tutorial berikutnya dengan efek-efek jquery lainnya.
Terimakasih