====== HTML DOM appendChild() Method ====== * description : HTML DOM appendChild() Method * author : 오션 * email : shlim@repia.com * lastupdate : 2021-06-03 \\ =====Source of the article===== [[https://www.w3schools.com/jsref/met_node_appendchild.asp|HTML DOM appendChild() Method]]\\ ====Example==== 목록(list)에 항목(item)을 첨부합니다.\\

Click the button to append an item to the end of the list.

Note:
First create an LI node,
then create a Textnode,
then append the Text node to the LI node.
Finally append the LI node to the list.

 \\ Before appending:\\ * Coffee * Tea \\ After appending:\\ * Coffee * Tea * Water =====Definition and Usage===== %%appendChild()%% 메서드는 하나의 노드를 노드의 마지막 자식으로 추가합니다.\\ \\ **Tip:** 텍스트가 있는 새 단락(paragraph)을 만들려면, 단락에 추가하는 텍스트 노드로 텍스트를 만든 다음, 문서에 단락을 추가해야 합니다.\\ \\ 이 메서드를 사용하여 한 요소에서 다른 요소로 요소를 이동할 수도 있습니다 ("추가 예제"참조).\\ \\ **Tip:** %%insertBefore()%% 메서드를 사용하여 지정된 기존 자식 노드 앞에 새 자식 노드를 삽입합니다.\\ =====Syntax===== node.appendChild(node) =====Parameter Values===== | Parameter ^ Type ^ Description ^ | node | Node Object | 필수입니다. 첨부하려는 노드 객체입니다. | =====Technical Details===== Return Value: 첨부된 노드를 나타내는 노드 객체\\ =====More Examples===== 목록 항목(list item)을 한 목록에서 다른 목록으로 이동:\\ Before appending:\\ * Coffee * Tea * Water * Milk \\ After appending:\\ * Coffee * Tea * Milk * Water

Click the button to move an item from one list to another.

 \\ ====Example==== %%

%% 요소를 만들고 %%

%% 요소에 추가합니다.\\

Click the button to create a P element with some text, and append it to DIV.

A DIV element

Example explained:
First create a P node,
then create a Text node,
then appendthe Text node to the P node.
Finally,get the DIV element with id="myDIV", and append the P node to DIV.

 ====Example==== 일부 텍스트가 포함된 %%

%% 요소를 만들고, 그 요소를 문서 본문(body) 끝에 추가합니다.\\ {{tag>오션 HTML DOM appendChild() Method}}