javascript - Having trouble with createElement and appendChild -
i have reasonably simple idea implement.
i have array of objects 2 properties: "id" , "name" list these in series of "p" tags within "div".
so here html:
<body> <div id="listview"></div> </body>
and here javascript in tag:
sessionstorage.eventid = 2; var playerlist = []; playerlist[0].id = 0; playerlist[0].name = "add new player"; playerlist.push({ id: 5, name: "asako" }); playerlist.push({ id: 6, name: "james" }); playerlist.push({ id: 7, name: "brian" }); playerlist.push({ id: 8, name: "helmut spargle" }); function listall() { var element = document.getelementbyid("listview"); var div; var node; (var = 0; < playerlist.length; i++) { div = document.createelement("div"); div.setattribute("onclick", "javascript: formover(" + playerlist[i].id + ")"); node = "<p>" + playerlist[i].name + "<br />\n" + "<small> </small>\n" + "</p>\n"; div.appendchild(node); element.appendchild(div); } } window.onload = function(){ listall(); }
this doesn't fill anything. have put on jsfiddle well.
have misunderstood how array.push works? or appendchile , createelement?
thanks in advance help.
two problems - front, trying set id
, name
on playerlist[0]
(which doesn't exist yet) won't work.
second, trying add whole "node" full of html
, jquery-style, doesn't work in plain-js world. need build individual elements.
sessionstorage.eventid = 2; var playerlist = []; playerlist.push({ id: 0, name: "add new player" }); playerlist.push({ id: 5, name: "asako" }); playerlist.push({ id: 6, name: "james" }); playerlist.push({ id: 7, name: "brian" }); playerlist.push({ id: 8, name: "helmut spargle" }); function listall() { var element = document.getelementbyid("listview"); var div = document.createelement("div"); var node = "some string"; (var = 0; < playerlist.length; i++) { div = document.createelement("div"); div.setattribute("onclick", "formover(" + playerlist[i].id + ")"); var p = document.createelement('p'); p.innerhtml = playerlist[i].name; var br = document.createelement('br'); p.appendchild(br); var small = document.createelement('small'); small.innerhtml = ' '; p.appendchild(small); div.appendchild(p); element.appendchild(div); } } listall();
example: http://jsfiddle.net/nf45y/
Comments
Post a Comment