Apakah Kaedah append() dalam JavaScript

Apakah Kaedah Append Dalam Javascript



Katakan anda ingin membuat senarai dan menambah beberapa elemen. Ia menggunakan banyak masa sekiranya melakukannya secara manual. Untuk berbuat demikian, JavaScript menyediakan ' tambah() ” kaedah untuk mengambil objek sebagai hujah dan kemudian memasukkannya pada penghujung senarai yang ditentukan. Tambahan pula, anda juga boleh menambahkan elemen secara berbeza, seperti dalam senarai atau dalam bentuk perenggan.

Siaran ini telah menyatakan kaedah untuk mencari id objek dalam tatasusunan objek JavaScript.

Apakah Kaedah append() dalam JavaScript?

' tambah() ” kaedah dalam JavaScript digunakan untuk memasukkan elemen atau objek rentetan di hujung elemen. Ini adalah salah satu kaedah yang paling berguna untuk menambah elemen yang diperlukan pada kedudukan yang ditentukan di hujung elemen.







Bagaimana untuk Menggunakan Kaedah append() dalam JavaScript?

Untuk menggunakan fungsi append() dalam JavaScript, ikuti sintaks yang dinyatakan di bawah:



( pemilih ) . tambahkan ( kandungan, fungsi ( indeks, html ) )

di sini:



  • pemilih ” ialah elemen HTML yang diakses.
  • tambah() ” kaedah digunakan untuk menambahkan elemen.
  • kandungan ” ialah parameter yang diperlukan, yang menentukan kandungan data untuk ditambahkan.
  • fungsi() ” ialah elemen pilihan.

Contoh 1: Tambahkan Elemen yang Sama dalam Perenggan

Untuk menambahkan elemen yang sama dalam perenggan, pertama, buka halaman HTML yang berkaitan dan gunakan '

teg ” untuk membenamkan data di antara teg. Selain itu, tetapkan ' ID ” ke perenggan untuk mengaksesnya dalam JavaScript:





< p id = 'elemen' > Selamat datang ke Linuxhint hlm >

Seterusnya, buat butang dengan bantuan ' elemen ” dan gunakan “ kelas ” untuk menentukan nama tertentu dan membenamkan teks dengan elemen butang untuk dipaparkan pada butang:

< butang kelas = 'btn' > Tambah Elemen butang >

Sekarang, gunakan ' teg ” untuk menambah kod JavaScript:



< skrip >

$ ( dokumen ) . sedia ( fungsi ( ) {

$ ( '.btn' ) . klik ( fungsi ( ) {

$ ( '#elemen' ) . tambahkan ( 'Tambahkan teks pada klik butang' ) ;

} ) ;

} ) ;

skrip >

Mengikut kod yang diberikan:

  • sedia() ” kaedah digunakan untuk menyediakan fungsi apabila dokumen berjaya dimuatkan pada skrin. Untuk berbuat demikian, lulus ' fungsi() ” kaedah sebagai parameter.
  • klik() ” kaedah memanggil apabila pengguna mengklik pada elemen butang HTML. Kaedah ini menentukan pelaksanaan klik apabila pengguna menekan butang.
  • tambah() ' kaedah memasukkan set objek selepas pelaksanaan ' klik() ” kaedah. Untuk tujuan itu, hantar teks yang perlu ditambahkan.

Pengeluaran

Contoh 2: Tambahkan Elemen Berbeza dalam Borang Senarai

Anda boleh menambahkan elemen yang berbeza dalam bentuk senarai. Untuk berbuat demikian, buat halaman HTML dan benamkan teks dengan bantuan “

” tag:

< p id = 'tambah' > Tambahan JavaScript ( ) Fungsi hlm >

Buat butang menggunakan ' elemen ” dan gunakan “ onclick ” peristiwa yang berlaku apabila pengguna mengklik pada elemen HTML:

< butang onclick = 'func()' > Tambah Elemen butang >

Buat bekas div dan tetapkan id kepada bekas itu dengan menggunakan ' ID ” atribut. Seterusnya, tambahkan elemen dengan bantuan '

” tag:

< id div = 'lebih unsur' >

< hlm > unsur 1 hlm >

< hlm > unsur 2 hlm >

div >

Seterusnya, gunakan ' ” dan tambahkan kod berikut di antara tag:

< skrip >

var ElementNumber = 3 ;

fungsi fungsi ( ) {

adalah ibu bapa = dokumen. getElementById ( 'lebih-elemen' ) ;

ialah newElement = '

Elemen' + ElementNumber + '

'
;

ibu bapa. masukkanAdjacentHTML ( 'sebelum' , dan Elemen ) ;

ElementNumber ++;

}

skrip >

Dalam kod yang dinyatakan di atas:

  • Istiharkan pembolehubah menggunakan “ adalah ” kata kunci dan tetapkan nilai padanya mengikut keutamaan anda.
  • Tentukan fungsi dan mulakan pembolehubah lain di dalam fungsi yang ditentukan dengan nama tertentu.
  • Kemudian, panggil ' getElementById() ” Kaedah JavaScript untuk mengakses elemen dan lulus nilai id sebagai parameter.
  • insertAdjacentHTML() ” kaedah digunakan untuk menambah kod HTML ke dalam kedudukan tertentu dan menambah elemen bersebelahan antara satu sama lain.
  • Gunakan operator kenaikan untuk membuat kenaikan dalam elemen:

Anda telah mempelajari tentang penggunaan kaedah append() dalam JavaScript dengan pelbagai contoh.

Kesimpulan

tambah() ” ialah kaedah JavaScript yang digunakan untuk memasukkan elemen dan objek pada akhir elemen yang ditentukan. Anda boleh menambahkan elemen yang sama dan elemen yang berbeza dalam bentuk perenggan dan senarai. Lebih khusus lagi, ia boleh dicetuskan pada satu klik butang. Siaran ini telah menunjukkan kaedah append() dalam JavaScript.