jQuery는 컨테이너 자체를 포함하여 컨테이너의 HTML을 얻습니다.

내부에있는 내용뿐만 아니라 '#container'를 포함하여 '#container'에서 HTML을 얻는 방법은 무엇입니까?

<div id="container">
 <div id="one">test 1 </div>
 <div id="two">test 2 </div>
 <div id="three">test 3 </div>
 <div id="four">test 4 </div>
</div>

#container 안에 html을 가져 오는 것이 있습니다. #container 요소 자체는 포함하지 않습니다. 그게 내가하고자하는 일이야

var x = $('#container').html();
$('#save').val(x);

http://jsfiddle.net/rzfPP/58/ 확인

컨테이너를 더미 P태그로 감싸면 컨테이너 HTML도 얻을 수 있습니다.

당신이해야 할 일은

var x = $('#container').wrap('<p/>').parent().html();

http://jsfiddle.net/rzfPP/68/ 에서 실제 예제를 확인하십시오.

에 태그 완료, 당신은 추가 할 수 있습니다unwrap()<p>

$('#container').unwrap();

var x = $('#container').get(0).outerHTML;

업데이트 : 이제 FireFox 11 (2012 년 3 월)부터 Firefox에서 지원됩니다.

다른 사람들이 지적했듯이 FireFox에서는 작동하지 않습니다. FireFox에서 작동 해야하는 경우이 질문에 대한 답변을 살펴보십시오 .jQuery에서 html () 또는 text ()와 유사한 함수가 있지만 일치하는 구성 요소의 전체 내용을 반환합니까?

나는 이것을 사용하고 싶다;

$('#container').prop('outerHTML');

var x = $('#container')[0].outerHTML;

$('#container').clone().wrapAll("<div/>").parent().html();

업데이트 : outerHTML은 파이어 폭스에서 작동하므로 매우 오래된 버전의 파이어 폭스를 지원하지 않으면 다른 답변을 사용하십시오

Oldie but goldie ...

사용자가 jQuery를 요청하므로 간단하게 유지하겠습니다.

var html = $('#container').clone();
console.log(html);

여기 바이올린

$.fn.outerHtml = function(){
    if (this.length) {
        var div = $('<div style="display:none"></div>');
        var clone =
        $(this[0].cloneNode(false)).html(this.html()).appendTo(div);
        var outer = div.html();
        div.remove();
        return outer;
    }
    else {
        return null;
    }
};

에서 http://forum.jquery.com/topic/jquery-getting-html-and-the-container-element-12-1-2010

Firefox는 outerHTML을 지원하지 않으므로이를 지원 하는 함수 를 정의 해야 합니다.

function outerHTML(node) {
    return node.outerHTML || (
        function(n) {
            var div = document.createElement('div');
            div.appendChild( n.cloneNode(true) );
            var h = div.innerHTML;
            div = null;
            return h;
        }
    )(node);
}

그런 다음 outerHTML을 사용할 수 있습니다.

var x = outerHTML($('#container').get(0));
$('#save').val(x);

var x = $($('div').html($('#container').clone())).html();

예제가있는 간단한 솔루션 :

<div id="id_div">
  <p>content<p>
</div>

id = "other_div_id"인이 DIV를 다른 DIV로 이동

$('#other_div_id').prepend( $('#id_div') );

끝