获取.get返回的div元素的HTML

时间:2022-11-28 00:21:06

I'm trying to get the HTML of a specific div returned by a .get request (the .get request, returns HTML data with 3 divs with 3 different ids)

我正在尝试获取由.get请求返回的特定div的HTML。get请求(.get请求,返回带有3个不同id的3个div的HTML数据)

Here's my code:

这是我的代码:

$.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" ???
});

EDIT:

编辑:

The content of learn-more.html:

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>

2 个解决方案

#1


4  

$response.find('#main-images') will return an empty jQuery object. None of the selected elements has a descendant with ID main-images. Instead, one of the selected elements is the one you are looking for.

$response.find('#main-images')将返回一个空的jQuery对象。所选元素中没有一个具有ID主图像的后代元素。相反,选择的元素之一是您正在寻找的元素。

To get the a reference to the div use .filter() [docs] instead :

要获得对div的引用,可以使用.filter() [docs]:

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

If you want to get the HTML, append the content to an empty div first and remove the unwanted elements:

如果您想获得HTML,请先将内容附加到空div中,并删除不需要的元素:

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

or use a outerHTML plugin:

或者使用外部html插件:

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

#2


0  

$(data) returns an array of elements and not an ordinary jQuery object. $(data)[1] contains your #main-images element.

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

As Felix Kling answered, you can use filter instead of find.

正如Felix Kling所言,你可以使用过滤器而不是find。

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

#1


4  

$response.find('#main-images') will return an empty jQuery object. None of the selected elements has a descendant with ID main-images. Instead, one of the selected elements is the one you are looking for.

$response.find('#main-images')将返回一个空的jQuery对象。所选元素中没有一个具有ID主图像的后代元素。相反,选择的元素之一是您正在寻找的元素。

To get the a reference to the div use .filter() [docs] instead :

要获得对div的引用,可以使用.filter() [docs]:

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

If you want to get the HTML, append the content to an empty div first and remove the unwanted elements:

如果您想获得HTML,请先将内容附加到空div中,并删除不需要的元素:

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

or use a outerHTML plugin:

或者使用外部html插件:

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

#2


0  

$(data) returns an array of elements and not an ordinary jQuery object. $(data)[1] contains your #main-images element.

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

As Felix Kling answered, you can use filter instead of find.

正如Felix Kling所言,你可以使用过滤器而不是find。

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