Question

    jQuery.get("ajax.php", function(data)
    {
        $(data).find("div[id^='feed']").each(function() //Find every div with id starting with feed in AJAX response
            {
                $('#' + $(this).attr("id")).remove();
            });
        $("#newsfeed").prepend(data);
    });

这适用于在ajax响应中符合此描述的一些div，但不是全部。提前谢谢。

为了说清楚，我想发送一个针对HTML的AJAX请求，通过响应中的所有div来进行迭代。如果他们与DOM中已存在的内容共享id并且id以“feed”开头，请将其删除。然后将AJAX添加到新闻源的顶部。对不起，如果我之前没有正确解释。

Answer 1

问题是你不能在jQuery（“html snippet”）构造中使用.find。您必须将它附加到DOM中的容器，然后删除不需要的元素。例如：

$('#newsfeed').prepend(data).find('div[id^=feed]').remove();

编辑：删除ID仅以响应中的Feed开头的项目：

$('<div class="moar_feed">' + data + '</div>') // create detached elements from the data response, wrapping them inside a <div with class="moar_feed" (arbitrary class name, not even necessary)
.appendTo('#newsfeed') // add the newly created HTML elements to the #newsfeed. the return value of appendTo is the HTML you just created, so you can now call .find() on it
.find('div[id^=feed]') // find the DIVs with id starting with "feed" inside the newly created elements
.remove() // remove them from the DOM

Answer 2

我认为问题在于这部分：

$(data).find("div[id^='feed']")

当你将一串html传递给jQuery时，就像使用$(data)一样，jQuery创建DOM元素以匹配字符串（这些元素最初与文档分离），然后返回一个包含只有顶级元素。也就是说，如果您的字符串包含嵌套元素，则会创建所有元素，但只会在jQuery对象中返回顶级元素。

.find("div[id^='feed']")然后查找上一步创建的jQuery对象中元素的后代的div元素，因此它不匹配任何顶级元素。

.filter() method可让您过滤顶级元素，因此您可以执行以下操作：

jQuery.get("ajax.php", function(data)
{
   var $newEls = $(data);

   $newEls.filter("div[id^='feed']")
          .add( $newEls.find("div[id^='feed']") )
          .each(function() {
       $('#' this.id).remove();
   });

   $("#newsfeed").prepend(data);
});

在.each()内你可以说this.id而不是$(this).attr("id")。

一些示例html可能有助于澄清我上面尝试解释的内容。给出：

data = "<div id='feed1'><div id='feed2'/><div id='xyz'/></div>
        <div id='abc'><div id='feed3'/></div>";

（忽略只有可读性的换行符）

然后$(data)将创建所有五个div，但返回一个仅包含'feed1'和'abc'div的jQuery对象，因为它们是唯一的顶级div。

$(data).find("div[id^='feed']")返回一个仅包含'feed2'和'feed3'div的jQuery对象，因为它们是$(data) jQuery对象中元素的唯一后代。

$(data).filter("div[id^='feed']")返回一个仅包含'feed1'div的jQuery对象。

编辑：您可以使用以下内容简化它：

jQuery.get("ajax.php", function(data)
{
   $("<div/>").append(data).find("div[id^='feed']").each(function() {
       $('#' this.id).remove();
   })
   $("#newsfeed").prepend(data);
});

这会创建一个完全空的div作为容器，以便您可以在该容器中使用.find()并取消.filter()。

JQuery每个都没有按预期工作

2 个答案: