如何將文字附加到``元素而不丟失資料？

將文字附加到<div> 沒有資料遺失的元素

使用AJAX 修改

<div> 時元素的內容，確保新數據不會覆蓋現有內容非常重要。這是此問題的解決方案：

var div = document.getElementById('divID');
div.innerHTML += 'Extra stuff';

此程式碼將新文字附加到

<div> 的現有內容中。元素。 innerHTML 屬性包含元素的整個 HTML 內容。透過使用 = 運算符，我們添加到現有內容而不是替換它。

說明：

getElementById 方法傳回

<div> 的參考。具有指定 ID（“divID”）的元素。 innerHTML 屬性包含該元素內的 HTML 內容。

= 運算子將字串「Extra stuff」附加到innerHTML 屬性的末尾。這可以有效地將新文字新增到現有內容中，而不刪除它。

範例：

考慮一個

<div>; ID 為「dataDiv」的元素：

<div>

如果我們執行JavaScript 程式碼：

var div = document.getElementById('dataDiv');
div.innerHTML += 'New Data';

<div> 的產生HTML 內容元素將是：

<div>

這種方法可讓您無縫更新

<div> 的內容。具有新資料的元素，而不遺失任何現有內容。