Comment convertir un objet jQuery en chaîne?

Question

Comment convertir un objet jQuery en chaîne?

Answer 1

Je suppose que vous demandez la chaîne HTML complète. Si tel est le cas, quelque chose comme cela fera l'affaire:

$('<div>').append($('#item-of-interest').clone()).html(); 

Ceci est expliqué plus en détail ici , mais vous créez essentiellement un nouveau noeud pour envelopper l'élément d'intérêt, effectuer les manipulations, le supprimer et récupérer le code HTML.

Si vous êtes juste après une représentation de chaîne, choisissez new String (obj) .

Mettre à jour

J'ai écrit la réponse originale en 2009. Depuis 2014, la plupart des principaux navigateurs prennent désormais en charge outerHTML en tant que propriété native (voir, par exemple, Firefox et Internet & nbsp; Explorer ), afin que vous puissiez faire:

$('#item-of-interest').prop('outerHTML');

Answer 2

Avec jQuery 1.6, cela semble être une solution plus élégante:

$('#element-of-interest').prop('outerHTML');

Answer 3

Il suffit d'utiliser .get (0) pour récupérer l'élément natif et obtenir sa propriété outerHTML:

var $elem = $('<a href="#">Some element</a>');
console.log("HTML is: " + $elem.get(0).outerHTML);

Answer 4

Pouvez-vous être un peu plus précis? Si vous essayez d’obtenir le HTML dans une balise, vous pouvez procéder de la manière suivante:

Extrait HTML:

<p><b>This is some text</b></p>

jQuery:

var txt = $('p').html(); // Value of text is <b>This is some text</b>

Answer 5

Le meilleur moyen de connaître les propriétés et les méthodes disponibles pour un nœud HTML (objet) est de procéder de la manière suivante:

console.log($("#my-node"));

À partir de jQuery 1.6+, vous pouvez simplement utiliser outerHTML pour inclure les balises HTML dans la sortie de votre chaîne:

var node = $("#my-node").outerHTML;

Answer 6

jQuery est en place ici, donc:

jQuery.fn.goodOLauterHTML= function() {
    return $('<a></a>').append( this.clone() ).html();
}

Renvoie tout ce contenu HTML:

$('div' /*elys with HTML text stuff that you want */ ).goodOLauterHTML(); // alerts tags and all

Answer 7

Cela semble bien fonctionner pour moi:

$("#id")[0].outerHTML

Answer 8

La réponse acceptée ne couvre pas les nœuds de texte (les caractères non définis sont imprimés).

Cet extrait de code résout le problème:

var htmlElements = $('<p><a href="http://google.com">google</a></p>↵↵<p><a href="http://bing.com">bing</a></p>'),
    htmlString = '';
    
htmlElements.each(function () {
    var element = $(this).get(0);

    if (element.nodeType === Node.ELEMENT_NODE) {
        htmlString += element.outerHTML;
    }
    else if (element.nodeType === Node.TEXT_NODE) {
        htmlString += element.nodeValue;
    }
});

alert('String html: ' + htmlString);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 9

Inutile de cloner et d’ajouter au DOM pour utiliser .html (), vous pouvez faire:

$('#item-of-interest').wrap('<div></div>').html()

Answer 10

Il est possible d'utiliser la fonction d'utilitaire jQuery.makeArray (obj) :

var obj = $('<p />',{'class':'className'}).html('peekaboo');
var objArr = $.makeArray(obj);
var plainText = objArr[0];

Answer 11

Si vous souhaitez formater un élément HTML afin de le transmettre et de le réanalyser à un élément, essayez de créer une requête unique pour cet élément:

// 'e' is a circular object that can't be stringify
var e = document.getElementById('MyElement')

// now 'e_str' is a unique query for this element that can be stringify 
var e_str = e.tagName
  + ( e.id != "" ? "#" + e.id : "")
  + ( e.className != "" ? "." + e.className.replace(' ','.') : "");

//now you can stringify your element to JSON string
var e_json = JSON.stringify({
  'element': e_str
})

que

//parse it back to an object
var obj = JSON.parse( e_json )

//finally connect the 'obj.element' varible to it's element
obj.element = document.querySelector( obj.element )

//now the 'obj.element' is the actual element and you can click it for example:
obj.element.click();

Answer 12

new String(myobj)

Si vous souhaitez sérialiser l'objet entier en chaîne, utilisez JSON .