JQuery: выбрать html элемента включительно?

Question

Какой лучший способ выбрать html элемента включительно? Например:

<div id="testDiv" class="testClass">
  This is just a test.
</div>

Принимая во внимание, $('#testDiv').html() возвращает "This is just a test.", я бы селектор, который возвращает:

<div id="testDiv" class="testClass">This is just a test.</div>.

Спасибо за ваши ответы.

Answer 1

Попробуйте это jQuery.outerHTML() реализация .

jQuery.fn.outerHTML = function() {
    return $('<div>').append( this.eq(0).clone() ).html();
};

Answer 2

Это похоже на принятый ответ, добавление 2 улучшений :

1. Возвращаемая строка, так что это цепочка. Пример: $ (выберите) .outerHTML (). Css (x);
2. Объявлено таким образом, чтобы не мешать другому коду. Смотри https://learn.jquery.com/plugins/basic-plugin-creation/

Вот код:

// add outer html selector
(function ($) {
    $.fn.outerHTML = function() {
        return $('<div>').append( this.eq(0).clone() ).html();
        return this;
    };
}(jQuery));