Membuat objek jQuery dari string HTML-besar

Saya memiliki string HTML besar yang berisi banyak node anak.

Apakah mungkin untuk membangun jQuery objek DOM menggunakan string ini?

Saya sudah mencoba $(string) tetapi hanya mengembalikan array yang berisi semua node individual.

Mencoba untuk mendapatkan elemen yang bisa saya gunakan fungsi .find () di.

Memperbarui:

Dari jQuery 1.8, kita bisa menggunakan $ .parseHTML , yang akan mem-parsing string HTML ke array node DOM. misalnya:

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

Apa yang terjadi dalam kode ini:

• $('<div/>')adalah palsu <div>yang tidak ada di DOM
• $('<div/>').html(string)menambahkan stringdalam palsu itu <div>sebagai anak-anak
• .contents()mengambil anak-anak palsu itu <div>sebagai objek jQuery

Jika Anda ingin .find()bekerja maka coba ini:

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

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

DEMO

Pada jQuery 1.8 Anda bisa menggunakan parseHtml untuk membuat objek jQuery Anda:

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));

Saya telah membuat JSFidle yang menunjukkan ini: http://jsfiddle.net/MCSyr/2/

Ini mem-parsing string HTML yang berubah-ubah menjadi objek jQuery, dan menggunakan find untuk menampilkan hasilnya dalam div.

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

Ini menciptakan objek jQuery dummy di mana Anda bisa meletakkan string sebagai HTML. Kemudian, Anda mendapatkan anak-anak saja.

Ada juga perpustakaan hebat bernama cheerio yang dirancang khusus untuk ini.

Implementasi inti jQuery cepat, fleksibel, dan ramping yang dirancang khusus untuk server.

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>

Saya menggunakan yang berikut ini untuk templat HTML saya:

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

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

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

Catatan: Dengan asumsi jika Anda menggunakan jQuery

alasan mengapa $ (string) tidak berfungsi adalah karena jquery tidak menemukan konten html antara $ (). Karena itu Anda harus menguraikannya terlebih dahulu ke html. setelah Anda memiliki variabel di mana Anda telah menguraikan html. Anda kemudian dapat menggunakan $ (string) dan menggunakan semua fungsi yang tersedia pada objek