General Info
I'm currently working on a chatsystem using a websocket. Aside from the messages, I'm using the same websocket to present the user with a userlist of those currently online.
The Problem
Since a couple of days I've been trying to script all of my Javascript purely in OOP approach. So far it's going pretty well but now I've stumpled upon a error I honestly don't understand:
Argument 1 of Node.appendChild is not an object
The Code
I've narrowed down my code as far as possible to only represent the important parts:
var CB = CB || {};
CB.messages = {
userListLayout: function(Username){
var userListTable = "<table class='userTable' data-user='"+ Username +"'><tbody><tr><td><img src='layout/images/default_profile.png'></td><td>" + Username + "</td></tr></tbody></table>";
return userListTable;
}
}
CB.users = {
set: function(Usernames) {
var List = document.getElementById('usersList'); // Represents an empty div
var i, j = Usernames.length, ListUser;
for (i=0; i<j; i++) {
ListUser = CB.messages.userListLayout(Usernames[i]);
List.appendChild(ListUser); // Error
}
}
}
So the question is: What am I doing wrong and what's the best way to fix it?
ListUser is a string of HTML. Node.appendChild only accepts a DOM node as an argument.
https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild
You have two options here, either wrap the text you want in a node and use appendChild or keep the current setup and use innerHTML which allows you to add a string to the HTML document:
List.innerHTML += ListUser
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments