使用jQuery Ajax获取另一个页面div的内容

我想page.html to ajax-request side.html的内容并提取其两个div的内容。 但是我无法找到解析响应的正确方法，尽管我尝试了一切。

这是side.html：

      
ContentA
 
ContentB
   

这是page.html

        Hello  jQuery.ajax({ url: "side.html", success: function(result) { html = jQuery(result); alert(html.find("div#a").attr("id")); alert(html.find("div#a").html()); alert(html.find("div#a")); }, });    

当我访问这个页面时，我没有得到任何错误，并且三个alert（）s产生undefined，undefined和[object Object]。 我究竟做错了什么？ 示例就在这里 。

Answer 1

您需要更改此行：

 html = jQuery(result); 

对此：

 html = jQuery('
').html(result); 

实际上，你应该将它声明为局部变量：

 var html = jQuery('
').html(result); 

说明

当你执行jQuery(result) ，jQuery会拉出元素的子元素并返回这些元素周围的包装器，而不是返回元素的jQuery包装器，我倾向于认为它非常愚蠢。

在您的情况下，sidebar.html的包含几个元素和一些文本节点。 因此，返回的jQuery对象是这些元素和文本节点的包装器。

当您使用.find() ，它会搜索由您调用它的jQuery对象包装的元素的后代 。 在您的情况下，

不是其中之一，因为它实际上是包装器的选定元素之一，并且不能是它自身的后代。

通过将其包装在您自己的

中，然后将这些元素“向下”推到一个级别。 当您在上面的固定代码中调用.find()时，它会查找该

后代，因此会找到您的

。

评论

如果您的

不在顶级，即的直接子级，那么您的代码就可以了。 对我而言，这是不一致的，因此行为不正确。 要解决这个问题，当jQuery正在使用内容提取魔法时，它应该为你生成容器

。

Answer 2

试试这个 ：

 $.get(url,function(content) { var content = $(content).find('div.contentWrapper').html(); ... }