마지막으로 jQuery를 사용하여 요소 가져 오기 및 추가

Question

클래스가 .carousel-inner 인 div 부모 요소가 있습니다. 이 상위 div 안에는 몇 개의 하위 요소가 있습니다. 나는 2 번째 (자식) 요소를 취해 마침내 그 요소를 추가하려고합니다. 나는 이처럼 두 번째 요소를 추가하고 추가하고있다.

var a = $(".carousel-inner").children()[1]; 
$(".carousel-inner").append(a); 

이제이 요소를 추가하면이 요소가 두 번째 위치에서 제거되고 마지막에 추가됩니다. 이 요소를 두 번째 위치에도 유지하고 싶습니다. 내가 어떻게 해?

Answer 1

clone()을 사용하면 요소를 찾을 수 있습니다. 그냥과 같이 추가하기 전에 다른 변수

var a = $(".carousel-inner").children()[1], 
 
    b = $(a).clone(); 
 
$(".carousel-inner").append(b);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <div class="child"> 
 
    a 
 
    </div> 
 
     <div class="child"> 
 
    this clones 
 
    </div> 
 
     <div class="child"> 
 
    c 
 
    </div> 
 
</div>

를하거나 요소를 복제 :

var a = $(".carousel-inner").children()[1] 
 
$(a).clone().appendTo('.carousel-inner');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <div class="child"> 
 
    a 
 
    </div> 
 
     <div class="child"> 
 
    this clones 
 
    </div> 
 
     <div class="child"> 
 
    c 
 
    </div> 
 
</div>

Answer 2

사용 .clone()

$(a).clone().appendTo('.carousel-inner'); 

Answer 3

사용 clone(); .. $ ("P")과 같은 beolw

var a = $(".test").children()[1]; 
a = $(a).clone(); 
$(".carousel-inner").append(a); 

Answer 4

사용 클론 클론 함수() appendTo ("신체");

Answer 5

복제 당신이 원하는 것을 달성 할 수있는 좋은 방법입니다 :

var a = $(".carousel-inner").children().eq(1); 
a.clone().appendTo('.carousel-inner'); 

$(".carousel-inner").children()[1]는 DOM 객체를 얻을 $(".carousel-inner").children().eq(1)는 jQuery 오브젝트 를 얻고 복제 만 JQuery와 객체에 정의되어 있기 때문에 오류를 받고 있습니다.

Answer 6

이렇게 할 수도 있습니다. 내 대답은 아래와 같이

var a = $(".carousel-inner").children().eq(1).prop('outerHTML'); 
 
$(".carousel-inner").append(a);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
<div class"first-child">First</div> 
 
<div class"second-child">Second</div> 
 
    <div class"third-child">Third</div> 
 
    <div class"fourth-child">Fourth</div> 
 
</div>