jquery中查找和过滤的区别答案

【问题标题】：Difference between find and filter in jqueryjquery中查找和过滤的区别
【发布时间】：2012-04-30 05:07:32
【问题描述】：

我正在从 wiki 页面获取数据。我正在使用php 和jquery 的组合来执行此操作。首先，我在php 中使用curl 来获取页面内容并回显内容。文件名为content.php：

$url = $_GET['url'];
$url = trim($url," ");
$url = urldecode($url);
$url = str_replace(" ","%20",$url);

echo "<a class='urlmax'>".$_GET['title']."</a>";
echo crawl($url);

然后jQuery 用于查找匹配的元素。

$.get("content.php",{url:"http://en.wikipedia.org/w/index.php?action=render&title="+str_replace(" ","_",data[x]),title:str_replace(" ","_",data[x])},function(hdata){
                        var imgs = $(hdata).find('a.image img');
                        var ent = $(hdata).filter('a.urlmax');


                        ent = $(ent[0]).text();


});

我能够成功获取图像，但是对于变量 ent，当我使用 find 而不是 filter 时，它返回一个空数组。只有过滤器在工作。这是为什么呢？

编辑：我知道查找和过滤之间的基本区别。这里a.image img 和a.urlmax 都是hdata 的后代。那为什么 find 在a.urlmax 上不起作用。不是 a.urlmax 单独它不适用于任何其他类或 id

【问题讨论】：

Difference between find and filter的可能重复

标签： jquery find web-crawler

【解决方案1】：

.find() http://api.jquery.com/find/

获取当前匹配元素集合中每个元素的后代，由选择器、jQuery 对象或元素过滤。

另一方面，过滤器作用于当前匹配的元素。这就是 filter 起作用但 find 不起作用的原因（您需要查看当前元素）。

【讨论】：

【解决方案2】：

.find()

它将返回所选元素的后代元素。

示例（jsfiddle）：

    <style>
      .Cell{
         margin: 15px;
         width: 400px;
         border: 2px solid lightgrey;
    
      }
      .Cell * {
         display: block;
         border: 2px solid lightgrey;
         color: lightgrey;
         padding: 5px;
         margin: 10px;
    }
    </style>

    <div class='Cell Plus'>div (1)
      <div class='Plus'>Child</div>
    </div>
    
    <div class='Cell Plus'>div (2)
      <div class='Plus'>Child</div>
    </div>

JS：

$(".Cell").find(".Plus").css({"color": "red", "border": "2px solid red"});

结果：

.filter()

它将返回符合特定条件的元素。

使用上面相同的html：

$(".Cell").filter(".Plus").css({"color": "red", "border": "2px solid red"});

结果：

【讨论】：

【解决方案3】：

filter 将从被选元素中选择元素的子集

find 将选择所选元素的后代/子元素

为了更清楚，filter 将搜索所有元素，而 find 将仅在后代列表中搜索

【讨论】：

$.filter 不搜索后代。