[jQuery] 제이쿼리 clone()으로 요소 복사

오늘은 제이쿼리에서 요소를 복사하는 방법에 대해 알아보도록 하겠습니다.

clone() 함수를 사용하면 쉽게 할 수 있습니다.

 

1. 문법.

$(복사 대상).clone()

2. 예제.

<div class="a">
    <p class="b">1</p>
</div>
<script>
    $('.b').clone().appendTo('.a')
</script>

class가 b인 요소를 복사해 class가 a인 태그에 추가하는 코드입니다.

만약 clone을 사용하지 않고 appendTo를 해주면

<div class="a">
    <p class="b">1</p>
</div>
<script>
    $('.b').appendTo('.a')
</script>

아래와 같은 결과가 나옵니다.

b태그가 옮겨지는 개념이기 때문에 1이 하나만 나옵니다.

기존에 있던 것을 다른 곳에도 추가하고 싶을 때는 clone()을 사용해 복사본을 만든 후 추가해야 합니다.