다른 DIV 앞에 부모 DIV 안에 DIV를 작성하십시오. DIV

Question

이 방법을 더 간단하게 만들 수있는 방법이 있습니까?

$('#content').append('<div id="bar"></div>'); 
$('#bar').insertBefore('#footer'); 
$('#foo').appendTo('#bar'); 

이것은 최종 제품의 모양입니다. 그러나 이렇게하는 것이 더 깨끗한 방법이라고 가정합니다.

<div id="content"> 
    <div id="bar"> 
    <div id="foo"></div> 
    </div> 
    <div id="footer"></div> 
</div> 

... 음, 두 줄로 줄였습니다.

$('<div id="bar"></div>').insertBefore('#footer'); 
$('#foo').appendTo('#bar'); 

#footer가 항상 있기 때문에 #content에 추가 할 이유가 없습니다.

Answer 1

내가 제안 수 :

$('<div id="bar" />').insertBefore($('#footer')).append('<div id="foo" />'); 

JS Fiddle demo.

간결하게하기 위해 (실제로 솔직히 읽고 이해하기가 쉽다)이긴하지만, 처음 시도한 것보다 훨씬 간단합니다.

나는 위의 코드에서 #foodiv이 페이지에 이미 존재하지 않는다고 가정합니다. 그것은 가하는 경우 다음 대신 사용 이미 존재 :

$('<div id="bar" />').insertBefore($('#footer')).append($('#foo'));​ 

JS Fiddle demo합니다.

참고 :

• append().
• insertBefore().