javascript - Does element.appendChild(node) applies properties of parent node to child node? -
i new html , js. need create dynamic expand-collapse list. var parentid = document.getelementbyid("abcd") parentid.setattribute("data-toggle","collapse") parentid.setattribute("data-target","#collapse1") var tag = document.createelement("ul"); tag.setattribute("id","collapse1") tag.appendchild(document.createtextnode("pqr")) parentid.appendchild(tag)
trying list as- abcd pqr
so in case, when clicking on abcd, pqr gets expanded/collapsed. problem on clicking on pqr, gets collapsed again. properties of parent gets applied child node also?
it's not gets properties of it's parent, has how events handled, event bubbling. when click child element, click event if fired parent elements of clicked on
to cancel event bubbling when click appended elements need event.stoppropagation()
inside of click handler new elements
after append them following
// tag.appendchild code goes here, following document.queryselector("#collapse1").onclick=function(event){ event.stoppropagation(); }
also, should mention 10 times easier jquery
Comments
Post a Comment