Зачем получать внешний HTML не работает?

Question

Я пытаюсь получить внешний HTML двумя разными способами, основываясь на этот вопрос. Отказ К сожалению, никто из них не дает ожидаемого результата:

HTML:

<div id='my_div'>Hello</div>

JS:

$(function() {
    document.write('[' + $('#my_div').clone().wrapAll("<div />").parent().get(0).innerHTML + ']<br />');
    document.write('[' + (new XMLSerializer().serializeToString(document.getElementById('my_div'))) + ']');
});

Выход:

[
Hello
]
[
Hello
]

Я ожидаю, что следующий результат: <div id='my_div'>Hello</div>

Живой пример здесь

Что я делаю неправильно ?

Answer 1

Первый, Ваш первый пример работает нормально. Отказ Посмотрите на свой вывод в Пожар. Отказ Обратите внимание, что, поскольку ваш выход это HTML это отображается как HTML. Отказ Обратите внимание, что есть ножильные линии до и после HELLO............... поскольку HELLOS внутри Рав!

Посмотри:

---

Второй с jQuery, вы также можете использовать Метод в моем ответе на вопрос, который вы связали с:

var outerHTML =  $('<div>').append( $("#my_div").clone() ).html();

Пример jsfiddle

Это добавляет клону элемента под вопросом на объект jQuery div jQuery и получает внутренний HTML объекта div jQuery .... который представляет собой внешний элемент под вопросом.

Общая форма превзображения элемента:

$('<div>').append( $(ElementSelector).clone() ).html();

куда ElementSelector Это селектор jQuery элемента, который вы хотите.

---

Примечание. Вышеуказанное не добавляет новых элементов до DOM. $('<div>')...... никогда не добавляется в дом. Это остается просто объектом jQuery независимо от дома.

Answer 2

Вот функция, используемая в lib pure.js. Чтобы получить OUTERHTML:

function outerHTML(node){
    return node.outerHTML || new XMLSerializer().serializeToString(node);
}

И использовать его домо.

var html = outerHTML(document.getElementById('my_div'));

Answer 3

ОБНОВИТЬ С участием Демонстрация

   $(function() {
        var html = $('<div>').append($('#my_div').clone()).html();
        $('body').html( htmlspecialchars( '[' + html + ']' ) );
   });

• Функция htmlspecialchars

Answer 4

попробуй это:

var result = $('<div></div>').append($('#my_div').clone()).html();
alert(result);

Answer 5

Вы можете использовать get вытащить нативный элемент DOM, а затем использовать outerHTML так как :

var html = $('#my_div').get(0).outerHTML;

или

var html = $('#my_div')[0].outerHTML;