Metode append

Metode append menambahkan teks ke akhir elemen. Juga terdapat metode appendTo, yang bekerja dengan cara serupa.

Sintaks

Menyisipkan teks ke akhir elemen:

javascript$(selektor).append(teks);

Ke akhir elemen yang dipilih dapat ditambahkan teks, yang akan dikembalikan oleh fungsi pengguna. Fungsi dipanggil, secara terpisah untuk setiap elemen yang dipilih. Saat dipanggil ia diberikan parameter berikut: posisi elemen dalam kumpulan, konten saat ini dari elemen:

javascript$(selektor).append(function(nomor dalam kumpulan, konten saat ini elemen));

Konten juga dapat berupa bukan hanya teks biasa tetapi juga elemen DOM atau objek jQuery. Dalam hal ini elemen-elemen tersebut akan dipindahkan dari posisinya dalam kode HTML.

Contoh

Mari sisipkan teks ke akhir paragraf yang ditentukan:

html<p id="test">teks</p>
javascript$('#test').append('!!!');

Kode HTML akan menjadi seperti ini:

html<p id="test">teks!!!</p>

Contoh

Mari sisipkan teks dengan tag ke akhir paragraf yang ditentukan:

html<p id="test">teks</p>
javascript$('#test').append('<b>!!!</b>');

Kode HTML akan menjadi seperti ini:

html<p id="test">teks<b>!!!</b></p>

Contoh

Mari temukan semua paragraf dan di akhir setiap paragraf berikan nomor urutnya dalam kumpulan:

html<p>teks</p>
<p>teks</p>
<p>teks</p>
<p>teks</p>
<p>teks</p>
javascript$('p').append(function(index, text){return index;});

Kode HTML akan menjadi seperti ini:

html<p>teks0</p>
<p>teks1</p>
<p>teks2</p>
<p>teks3</p>
<p>teks4</p>

Lihat juga

  • metode appendTo,
    yang menambahkan teks ke akhir elemen
  • pseudoelemen after,
    yang menambahkan teks ke akhir elemen pada CSS
  • metode prepend, before, after,
    yang memungkinkan penambahan konten di tempat tertentu