jQuery отримати html контейнера, включаючи сам контейнер

Як я можу отримати HTML на "#container", включаючи "#container", а не тільки те, що знаходиться всередині нього.

<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>

У мене є це, яке отримує html всередині #container. він не включає сам елемент #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 станом на FireFox 11 (березень 2012 р.)

Як зазначали інші, це не спрацює у FireFox. Якщо вам потрібно, щоб він працював у FireFox, ви, можливо, захочете поглянути на відповідь на це запитання: Чи є у jQuery функція, схожа на html () або text (), але повертає весь вміст відповідного компонента?

Я люблю це використовувати;

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

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

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

Оновлення: externalHTML зараз працює на firefox, тому використовуйте іншу відповідь, якщо вам не потрібно підтримувати дуже старі версії firefox

Олді, але золото ...

Оскільки користувач просить 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 не підтримує зовнішнійHTML , тому вам потрібно визначити функцію, яка допоможе його підтримати:

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);
}

Потім ви можете використовувати externalHTML:

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

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

Просте рішення з прикладом:

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

Перемістити цей DIV до іншого DIV за допомогою id = "other_div_id"

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

Закінчити