Question

我试图获取.get请求返回的特定div的HTML（.get请求，返回带有3个不同ID的3个div的HTML数据）

这是我的代码：

$.get("ajax/learn-more.html", function(data){
    var $response = $(data);
    alert($response.find('#main-images')); // <= prints [Object object]
    alert("Data Loaded: " + data); // <= displaysthe whole html of learn-more.html
    // how can I get the html of a div in learn-more.html with id="main-images" ???
});

编辑：

learn-more.html的内容：

<div id="something" class="hero-unit span-one-third" style="position: relative;">
    Foo Bar
</div>

<div id="main-images" class="hero-unit span-one-third" style="position: relative;">
    <div id="learn-more-photo" class="span-one-third">
        <img class="thumbnail" src="http://placehold.it/300x180" alt="">
    </div>
</div>

<div id="learn-more">
:D
</div>

Answer 1

$response.find('#main-images')将返回空 jQuery对象。所选元素均未具有ID为main-images的后代。相反，所选元素之一是您要查找的元素。

要获得对div使用.filter() ^[docs]的引用，请改为：

$response.filter('#main-images');

如果您想获取HTML，请先将内容附加到空div并删除不需要的元素：

var container = $('<div />').html(data);
container.children().not('#main-images').remove();
var html = container.html();

或使用outerHTML plugin：

var html = $response.filter('#main-images').outerHTML();

Answer 2

$(data)返回一个元素数组，而不是普通的jQuery对象。 $(data)[1]包含您的#main-images元素。

正如Felix Kling所说，您可以使用filter代替find。

$(data).filter('#main-images').html();

使用jQuery获取.get返回的div元素的HTML

2 个答案: