targetNode.appendChild(node) =>node를 넣어줘야 하고,append여러 개 하면
원래 것에 덮어쓰지는 않고 내가 원하는 노드의 맨 뒤에 해당요소를 새로 추가해줌.
targetElement.insertAdjacentElement(position, element);
=>내가 원하는 위치에 원하는 요소 삽입가능
position : beforebegin , afterbegin , beforeend, afterend
targetElement.insertAdjacantElement(beforeend, ) === targetNode.appendChild(node) <=string넣어주면 안된다.
element.innerHTML = 'DOM string넣어줘야(Node로 파싱됨)';
converting html string to Node
ref:
https://stackoverflow.com/questions/3103962/converting-html-string-into-dom-elements
https://stackoverflow.com/questions/47955013/html-elements-in-template-strings-in-js
-inner.HTML = String줘야,하는데 HTML태그를 주니 계속해서 [object HTMLDivElement]가 나왔다.
이 참에 appendChild와 innerHTML에 들어가는 것이 다르다는 것을 알게 되었다.
ref : https://www.reddit.com/r/learnjavascript/comments/3xh739/getting_object_htmldivelement_instead_of_div/
You can't just assign an element to innerHTML like that. That requires a string, but sisterDiv is an element, not a string. You're getting [object HTMLDivElement] because that's what happens when you coerce a JavaScript object to a string — what you've written is equivalent to writing stuff.innerHTML = sisterDiv.toString();.
z-index먹이려면 position:absolute안되는듯(relative사용)
superfly