Получить сырой HTML-код узла в JQuery

Question

Я использовал $("#parent").html(), чтобы получить внутренний html #parent, но как мне получить html самого родителя?

Прецедент, я захватить входной узел, как это:

var field = $('input'); 

Я хотел бы иметь возможность получить необработанный HTML этого узла (<input type='text'>) с чем-то вроде field.html(), но возвращает пустой , Это возможно?

Answer 1

Или вы можете создать добавить функцию JQuery, как это:

jQuery.fn.outerHTML = function(s) { 
    return (s) 
    ? this.before(s).remove() 
    : jQuery("<p>").append(this.eq(0).clone()).html(); 
} 

так что вы могли бы сделать это:

$('input').outerHTML(); 

или

$('input').outerHTML("new html"); 

благодаря http://yelotofu.com/2008/08/jquery-outerhtml/

Answer 2

Это несколько неудобно делать:

var field = $("input"); // assuming there is but 1 
var html = field.wrap("<div>").parent().html(); 
field.unwrap(); 

html() является, аналогичными innerHTML. Не существует «стандартного» метода outerHTML. Вышеописанный элемент привязывает элемент, который вы хотите использовать во временном элементе, и получает из него innerHTML.

Answer 3

Вы можете использовать:

var html = $('#parent')[0]; 

Это получит узел #parent, а затем возвращает код первого узла возвращается (который будет только один в этом случае).

Answer 4

Этот вопрос очень старый, но есть теперь простое решение:

var html = $('input').prop('outerHTML'); 

Пример строки значение html:
< входной тип = "вход" >

Fiddle с ним :
https://jsfiddle.net/u0a1zkL1/3

И , техника, упомянутая в комментарии Оптимы, также работает:

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