Penggunaan append() untuk menambahkan konten pada HTML

Posted on Updated on


jquery2Kali ini kita akan belajar mengenai append() Fungsi tersebut digunakan untuk menambahkan konten, baik berupa tulisan maupun elemen html. Konten tersebut ditambahkan sesudah atau sebelum element yang sudah ada. pada saat membuat applikasi ada kalanya kita membutuhkan fungsi ini misal untuk input multiple data ke dalam database , maka teknik append ini sangat cocok di terapkan .

Fungsi append digunakan untuk menambahkan konten sesudah konten tertentu. Perhatikan contoh berikut ini:

<!DOCTYPE html>
<html>
<head>
$(document).ready(function(){
    // Append Untuk Elemen Ke Samping
    $(“#btn1”).click(function(){
        $(“p”).append(Coba Tambah Elemen Ke samping.”);
    });
     // Append Untuk Elemen Ke bawah
    $(“#btn2”).click(function(){
        $(“ol”).append(
  • Coba Tambah Elemen Kebawah
  • );

        });
    });
    </head>
    <body>
    <p>ini Elemen samping</p>
    <p>ini elemen bawah.</p>
    <ol>
      <li>elemen</li>
      <li>elemen</li>
      <li>elemen</li>
    </ol>
    <button id=“btn1”>tambah ke samping</button>
    <button id=“btn2”>Tambah Kebawah</button>
    </body>
    </html>

    silahkan terapkan dan kreasikan codemu …. sekian dan terimakasih  Regards Rokansoft.

    Leave a Reply

    Fill in your details below or click an icon to log in:

    WordPress.com Logo

    You are commenting using your WordPress.com account. Log Out / Change )

    Twitter picture

    You are commenting using your Twitter account. Log Out / Change )

    Facebook photo

    You are commenting using your Facebook account. Log Out / Change )

    Google+ photo

    You are commenting using your Google+ account. Log Out / Change )

    Connecting to %s