[jQuery] .append()

안녕하세요. 경제적, 시간적 자유를 꿈꾸는 한량입니다.

jQuery의 .append() 사용법

jQuery의 .append() 메서드는 선택한 요소의 

마지막 자식 요소로 새로운 내용을 추가하는 함수입니다.

 

예를 들어, 다음과 같은 HTML 구조가 있다고 가정해 봅시다.

<div id="myDiv">
  <p>첫 번째 문장</p>
  <p>두 번째 문장</p>
</div>

여기서, #myDiv 요소에 새로운 <p> 요소를 추가하고 싶다면,

 jQuery의 .append() 메서드를 사용할 수 있습니다.

$('#myDiv').append('<p>세 번째 문장</p>');

위의 코드는 '#myDiv' 요소의 마지막 자식 요소로 '<p>세 번째 문장</p>'를 추가합니다. 

이제 HTML은 다음과 같이 변경됩니다.

<div id="myDiv">
  <p>첫 번째 문장</p>
  <p>두 번째 문장</p>
  <p>세 번째 문장</p>
</div>

.append() 메서드는 선택한 요소의 내부에 새로운 내용을 추가하기 때문에, 

선택한 요소가 비어있거나 아무 내용도 없는 경우, 

추가하려는 내용이 선택한 요소의 첫 번째 자식 요소가 됩니다.