為動態元素創建JavaScript變量

Question

我有一個div，其中包含用戶發送的消息更新。 如何為該div分配一個javascript變量，使其值始終是該div的當前內容，該內容始終與消息一起更新？

var x = document.getElementById("MessageBox"); // only equals value at the 
// time rather than present value

Answer 1

完成此操作的最簡單方法是為元素分配.onchange事件處理程序，然后將節點的值分配給函數范圍之外的變量：

var myMSGvalue;
document.getElementById("MessageBox").onchange = function () {
    myMSGvalue = this.value;
    // this will work for <input>, not <div>
}

如果確實需要將數據分配給html元素，則應使用<input type="hidden"> 。

但是，最好在將數據附加到頁面之前將其分配給變量。 例如，假設您有一個Web套接字：

var messages = [];
socket.on("msg", function (msg) {
    messages.push(msg);
    // msg: { content: "Hello!", author: "notSure" };
    functionToAppendToPage(msg);
})

現在，您可以看到在message中收到的所有messages ， messages[messages.length - 1]將返回最后收到的消息（前提是至少已收到一條消息）。

Answer 2

如果您的消息框字段使用任何Api或通過Ajax獲取數據。 您可以在將值分配給消息框之前更新變量。