[자바스크립트] 노드 생성하기, prepend, append, insertBefore, insertAfter, before, after, prependTo, appendTo


[자바스크립트] 노드 생성하기, prepend, append, insertBefore, insertAfter, before, after, prependTo, appendTo

위와 같은 리스트형태에 버튼이나 li태그를 클릭하면 노드를 추가해본다. jQuery없이 JS로 노드 생성 메뉴가 6까지 생성되어 있으니 cnt변수의 초깃값을 6으로 지정하고 버튼이 클릭될 때마다 cnt값을 1씩 증가시킨다. createElement를 통해 li태그를 생성해주는 li createTextNode를 통해 li태그안에 텍스트 내용을 생성해주는 liText getElementById를 통해 menu아이디를 가진 ul태그를 지정해 노드를 생성해줄 위치를 지정 만들어진 텍스트 노드를 li태그안에 appendChild를 통해 자식 노드로 붙여준다. li태그를 menu, ul태그에 붙여주면서 노드를 생성한다. 버튼 클릭 시 ul태그안에 li태그가 새로 생성된다. prepend( ) - 제일 앞 위치에 노..


원문링크 : [자바스크립트] 노드 생성하기, prepend, append, insertBefore, insertAfter, before, after, prependTo, appendTo