pm1122dev의 비밀노트

[Jquery] append, appendTo 차이점 본문

javascript&jquery

[Jquery] append, appendTo 차이점

pm1122Dev 2021. 4. 26. 22:38
728x90
반응형

api.jquery.com/append/#append-content-content

 

.append() | jQuery API Documentation

Description: Insert content, specified by the parameter, to the end of each element in the set of matched elements. The .append() method inserts the specified content as the last child of each element in the jQuery collection (To insert it as the first chi

api.jquery.com

api.jquery.com/appendTo/#appendTo-target

 

.appendTo() | jQuery API Documentation

Description: Insert every element in the set of matched elements to the end of the target. The .append() and .appendTo() methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With .ap

api.jquery.com

append와 appendTo의 결과는 같습니다. 다만 차이점이라 한다면 주체가 누가 되느냐가 다릅니다. 

예시를 보겠습니다.

 

html

 

<div class="box">
	<p class="tag">바나나</p>
</div>

jquery

$(function(){
	$(".tag").append("<p>딸기</p>");
    $("<p>수박</p>").appendTo(".tag");
})

결과

<div class="box">
	<p class="tag">바나나</p>
    <p>딸기</p>
    <p>수박</p>
</div>

 

728x90
반응형
저작자표시 (새창열림)

'javascript&jquery' 카테고리의 다른 글

[Jquery] 자식요소 찾기 children()  (0) 2021.04.26
[Jquery] element 내용 비우기 empty()  (0) 2021.04.26
slick.js 에러 $(...).slick is not a function 해결방법  (0) 2021.04.09
[jquery] 부모창 제어 opener, parent  (0) 2021.02.04
[jquery] element가 동적으로 추가됐을 경우 이벤트 주기  (1) 2021.02.01
'javascript&jquery' Related Articles more
Comments