变量内的jQuery选择器？答案

【问题标题】：jQuery Selector inside of variable?变量内的jQuery选择器？
【发布时间】：2013-05-11 13:06:50
【问题描述】：

您好，我正在尝试获取具有特定类的另一个 HTML 文件中的所有 DIV 的 ID。加载我使用的文件：

$.get("blocks.html", function(data) {
        //here I don't know how :)
});

现在我正在寻找类似这样的东西：

data.$('.block').each(... the rest is no problem

所以我不在我的页面代码上使用 jQuery 选择器，而是在数据变量的竞争中使用。感谢您的帮助！

【问题讨论】：

$('.block', data) 应该这样做……

标签： javascript jquery html jquery-selectors

【解决方案1】：

答案实际上取决于从 GET 请求返回的 responseText 的样子。基于此，您必须将其包装或不包装。

与父母

如果响应嵌套在父标签内。

回复标记：

<div>
   <div id="someId1"></div>
   <div id="yourId" class="block"></div>
   <div id="someId2"></div>
</div>

JavaScript：

var htmlFiltered = $(html).find('.block');

没有父母

如果响应没有包含内容的父节点，则需要添加父节点或使用过滤器。

回复标记：

<div id="someId1"></div>
<div id="yourId" class="block"></div>
<div id="someId2"></div>

JavaScript：

var htmlFiltered = $(data).filter('.block');

或

var htmlFiltered = $("<div/>").html(data).find('.block');

获取 ID

您可以在htmlFiltered 上使用map() 或each() 来获取ID。

与each()

var ids = [];
htmlFiltered.each( function () {
 ids.push(this.id);   
});
console.log(ids);

与map()

var ids = $.map(htmlFiltered, function (elem) {
 return elem.id;   
});
console.log(ids);

【讨论】：

【解决方案2】：

试试：

$.get("blocks.html", function(data) {
        $(data).find('.block').each(...
});

【讨论】：

【解决方案3】：

$.get("blocks.html", function(data) {
    var ids = $('<div/>').html(data).find('div.block').map(function() {
        return this.id;
    }).get();
});

【讨论】：

这是一个非常巧妙的解决方案，不知道为什么它没有那么多的支持

【解决方案4】：

试试这个：

$.get("blocks.html", function(data) {
        $(data).find('.block').each(function(){...});
});

如果您的“数据 html”包含元素是“.block”，请查看@undefined 的答案

【讨论】：

@Robj 烤了第一个回答。如果有什么你抄袭他的:)