添加一个数组到DOM与每个元素作为li

Question

我试图将此数组添加到DOM，每个字符串元素作为无序列表的一部分。下面我试着设置消息[i] =我想追加到列表的数组的元素，但它似乎没有工作。 Fetch new是一个回调函数，它在输入FYI时获取一串字符串。基本上我试图在ul的底部显示该数组中的每个元素。 ul class =“messages”fyi。我分配变量值的方式有什么问题吗？

function fetchNew() { 
     var PrintChat = function (Chat_Messages) { 
     var y = Chat_Messages.length; 
     for (i = 0; i < y; i++) { 

      var message[i] = $('<li>Chat_Messages[i]<li>'); 
      $('.messages').append(message[i]); 

     } 
    } 

Answer 1

我猜这是字面上输出Chat_Messages[i]反复？

你必须告诉JavaScript，它是一个要连接的变量。试试这个：

$(".messages").append("<li>"+Chat_Messages[i]+"</li>"); 

请注意，为了安全起见，你应该确保该消息被正确转义，或更好，但使用像createTextNode(Chat_Messages[i])本地DOM方法来保护您的网站从XSS攻击。

Answer 2

如果fetchNew是一个回调得到的字符串数组，你实际上是复杂的太多，简单的方法是，像这样：

function fetchNew(myArray) {       // receive the array as a parameter. 
    var length = myArray.length;      // Cache the length of array 
    for (i = 0; i < length; i++) {      // loop through the array. 
     var element = $('<li>' + myArray[i] + '<li>'); // concatenate the current value inside an LI and create a dom element. 
     $('.messages').append(element);    // Add element to the parent container 
    } 
}