Get HTML brut du nœud dans JQuery

Question

J'ai utilisé $("#parent").html() pour obtenir le code HTML interne de #parent, mais comment puis-je obtenir le code HTML du parent lui-même?

Le cas d'utilisation est, je prends un noeud d'entrée comme celui-ci:

var field = $('input'); 

Je voudrais être en mesure d'obtenir le code html brut de ce noeud (<input type='text'>) avec quelque chose comme field.html(), mais qui revient à vide . Est-ce possible?

Answer 1

Ou vous pouvez créer ajouter une fonction JQuery comme ceci:

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

vous pourriez donc faire:

$('input').outerHTML(); 

ou

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

grâce à http://yelotofu.com/2008/08/jquery-outerhtml/

Answer 2

Il est un peu difficile à faire:

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

html() est analogue à innerHTML. Il n'y a pas de méthode "standard" outerHTML. Ce qui précède enveloppe l'élément que vous voulez dans un élément temporaire et obtient le innerHTML de celui-ci.

Answer 3

Vous pouvez utiliser:

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

qui va faire le nœud #parent, puis retourner le code du premier noeud retourné (qui sera le seul dans ce cas).

Answer 4

Cette question est très ancienne, mais il y a maintenant une solution facile:

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

Exemple Valeur de chaîne de html:
< input type = "entrée" >

tripoter :
https://jsfiddle.net/u0a1zkL1/3

Et , la technique mentionnée dans le commentaire d'Optimae fonctionne également:

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