Créer un objet jQuery à partir d'une grosse chaîne HTML

J'ai une grosse chaîne HTML contenant plusieurs nœuds enfants.

Est-il possible de construire un objet DOM jQuery en utilisant cette chaîne?

J'ai essayé $(string)mais cela ne renvoie qu'un tableau contenant tous les nœuds individuels.

Je cherche à obtenir un élément sur lequel je peux utiliser la fonction .find ().

Mettre à jour:

Depuis jQuery 1.8, nous pouvons utiliser $ .parseHTML , qui analysera la chaîne HTML en un tableau de nœuds DOM. par exemple:

var dom_nodes = $($.parseHTML('<div><input type="text" value="val" /></div>'));

alert( dom_nodes.find('input').val() );

DEMO

var string = '<div><input type="text" value="val" /></div>';

$('<div/>').html(string).contents();

DEMO

Que se passe-t-il dans ce code:

• $('<div/>')est un faux <div>qui n'existe pas dans le DOM
• $('<div/>').html(string)ajoute stringdans ce faux en <div>tant qu'enfants
• .contents()récupère les enfants de ce faux en <div>tant qu'objet jQuery

Si vous voulez .find()travailler, essayez ceci:

var string = '<div><input type="text" value="val" /></div>',
    object = $('<div/>').html(string).contents();

alert( object.find('input').val() );

DEMO

Depuis jQuery 1.8, vous pouvez simplement utiliser parseHtml pour créer votre objet jQuery:

var myString = "<div>Some stuff<div>Some more stuff<span id='theAnswer'>The stuff I am looking for</span></div></div>";
var $jQueryObject = $($.parseHTML(myString));

J'ai créé un JSFidle qui démontre ceci: http://jsfiddle.net/MCSyr/2/

Il analyse la chaîne HTML arbitraire dans un objet jQuery et utilise find pour afficher le résultat dans un div.

var jQueryObject = $('<div></div>').html( string ).children();

Cela crée un objet jQuery factice dans lequel vous pouvez placer la chaîne au format HTML. Ensuite, vous n'avez que les enfants.

Il existe également une excellente bibliothèque appelée cheerio conçue spécialement pour cela.

Implémentation rapide, flexible et allégée du noyau jQuery conçu spécifiquement pour le serveur.

var cheerio = require('cheerio'),
    $ = cheerio.load('<h2 class="title">Hello world</h2>');

$('h2.title').text('Hello there!');
$('h2').addClass('welcome');

$.html();
//=> <h2 class="title welcome">Hello there!</h2>

J'utilise ce qui suit pour mes modèles HTML:

$(".main").empty();

var _template = '<p id="myelement">Your HTML Code</p>';
var template = $.parseHTML(_template);
var final = $(template).find("#myelement");

$(".main").append(final.html());

Remarque: en supposant que vous utilisez jQuery

la raison pour laquelle $ (string) ne fonctionne pas est que jquery ne trouve pas de contenu html entre $ (). Par conséquent, vous devez d'abord l'analyser en html. une fois que vous avez une variable dans laquelle vous avez analysé le html. vous pouvez alors utiliser $ (string) et utiliser toutes les fonctions disponibles sur l'objet