Создание объекта jQuery из большой HTML-строки

У меня есть большая строка HTML, содержащая несколько дочерних узлов.

Можно ли создать объект DOM jQuery с помощью этой строки?

Я пробовал $(string), но он возвращает массив, содержащий все отдельные узлы.

Imtrying для получения элемента, в который я могу использовать функцию .find().

ОТВЕТЫ

Ответ 1

Обновление:

Из jQuery 1.8 мы можем использовать $. parseHTML, который будет анализировать строку HTML в массиве узлов DOM. например:

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

Что происходит в этом коде:

  • $('<div/>') - это подделка <div>, которая не существует в DOM
  • $('<div/>').html(string) добавляет string в пределах этой подделки <div> как дети
  • .contents() извлекает дочерние элементы этого поддельного <div> в качестве объекта jQuery

Если вы хотите сделать работу .find(), попробуйте следующее:

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

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

DEMO

Ответ 2

Как и в jQuery 1.8, вы можете просто использовать parseHtml для создания объекта 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));

Я создал JSFidle, который демонстрирует это: http://jsfiddle.net/MCSyr/2/

Он анализирует произвольную строку HTML в объекте jQuery и использует find для отображения результата в div.

Ответ 3

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

Это создает фиктивный объект jQuery, в который вы можете поместить строку как HTML. Затем вы получаете только детей.

Ответ 4

Существует также большая библиотека под названием cheerio, разработанная специально для этого.

Быстрая, гибкая и скудная реализация основного jQuery, разработанного специально для сервера.

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>

Ответ 5

Я использую следующие для своих 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());

Примечание. Предполагая, что вы используете jQuery

Ответ 6

причина, по которой $(string) не работает, заключается в том, что jquery не находит html-контент между $(). Поэтому вам нужно сначала разобрать его на html. если у вас есть переменная, в которой вы проанализировали html. вы можете использовать $(string) и использовать все доступные функции для объекта