Rumah > hujung hadapan web > tutorial js > Bagaimana untuk Menambah Teks pada Elemen Div Menggunakan JavaScript Tanpa Kehilangan Data Sedia Ada?

Bagaimana untuk Menambah Teks pada Elemen Div Menggunakan JavaScript Tanpa Kehilangan Data Sedia Ada?

DDD
Lepaskan: 2024-11-14 18:21:02
asal
563 orang telah melayarinya

How to Append Text to a Div Element Using JavaScript Without Losing Existing Data?

Menambahkan Teks pada Elemen div Tanpa Kehilangan Data

Apabila menggunakan AJAX untuk menambahkan data pada <div> elemen yang diisi melalui JavaScript, mengekalkan data sedia ada boleh menjadi penting. Artikel ini meneroka kaedah untuk mencapai ini tanpa kehilangan data.

Penyelesaian:

Untuk menambahkan data baharu pada <div> elemen tanpa kehilangan kandungan sedia ada, ikut langkah berikut:

  1. Kenal pasti <div> elemen menggunakan atribut idnya:
var div = document.getElementById('divID');
Salin selepas log masuk
  1. Gunakan operator = untuk menambahkan data baharu pada kandungan HTML sedia ada dalam div:
div.innerHTML += 'Extra stuff';
Salin selepas log masuk

Contoh:

Pertimbangkan HTML berikut struktur:

<div>
Salin selepas log masuk
Salin selepas log masuk

Jika anda ingin menambahkan "Data baharu" pada <div> tanpa mengalih keluar kandungan sedia ada, anda boleh menggunakan kod JavaScript berikut:

var div = document.getElementById('myDiv');
div.innerHTML += 'New data';
Salin selepas log masuk

Selepas melaksanakan kod JavaScript ini, <div> akan mengandungi kandungan berikut:

<div>
Salin selepas log masuk
Salin selepas log masuk

Dengan menggunakan operator =, anda boleh menambahkan data baharu dengan lancar pada <div> elemen sambil mengekalkan kandungan sedia ada.

Atas ialah kandungan terperinci Bagaimana untuk Menambah Teks pada Elemen Div Menggunakan JavaScript Tanpa Kehilangan Data Sedia Ada?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan