我有一个包含多个子节点的大HTML字符串。
是否可以使用此字符串构造jQuery DOM对象?
我试过了,$(string)
但是它只返回一个包含所有单个节点的数组。
试图获得一个我可以使用.find()函数的元素。
更新:
从jQuery 1.8开始,我们可以使用$ .parseHTML,它将HTML字符串解析为DOM节点数组。例如:
var dom_nodes = $($.parseHTML('<div><input type="text" value="val" /></div>'));
alert( dom_nodes.find('input').val() );
var string = '<div><input type="text" value="val" /></div>';
$('<div/>').html(string).contents();
这段代码中发生了什么:
$('<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() );
从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中。
var jQueryObject = $('<div></div>').html( string ).children();
这将创建一个虚拟jQuery对象,您可以在其中将字符串作为HTML放置。然后,您只能得到孩子。
还有一个名为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>
我将以下内容用于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
$(string)不起作用的原因是jquery在$()之间找不到html内容。因此,您需要首先将其解析为html。一旦有了变量,就可以在其中解析html。然后,您可以使用$(string)并使用对象上所有可用的函数
您可以尝试如下
$($.parseHTML(<<table html string variable here>>)).find("td:contains('<<some text to find>>')").first().prev().text();
本文地址:http://javascript.askforanswer.com/congdahtmlzifuchuanchuangjianjqueryduixiang.html
文章标签:html , javascript , jquery
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!
文章标签:html , javascript , jquery
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!
评论已关闭!