Создание переменной javascript для динамического элемента

Question

У меня есть div, который содержит обновления сообщений, отправленные пользователями. Как я могу назначить переменную javascript этому div, так что это значение всегда является текущим содержимым 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">.

Однако было бы гораздо лучше назначить данные переменной перед добавлением ее на страницу. Например, предположим, что у вас есть веб-сокет:

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

Теперь вы можете увидеть все сообщения, полученные в messages и messages[messages.length - 1] возвращает последнее полученное сообщение (при условии, по крайней мере, одно сообщение было получено).