Question

我有一个简单的HTML表格，jQuery设置为在用户点击所需主题时隐藏行，因此只有被点击的主题仍然可见。我的问题是，虽然脚本正在运行但我不确定为什么并且通过jQuery文档并没有真正帮助我理解这一点。

以下是主题删除流程背后的简单逻辑：

if (topic != 'All') {
    $('#news').find('tr:has(td)').not(function() {
        return $(this).children(':nth-child(4)').text() == topic;
    }).hide();
}

当.not（）方法返回TRUE时，主题将从删除中排除，当它返回FALSE时，主题将被有效删除。这是为什么？ .not（）和.hide（）的返回值之间的关系是什么？ .not（）的返回值如何影响.hide（）的执行？

Answer 1

find方法将找到与其选择器匹配的元素，然后not方法将为每个元素运行回调函数。回调函数返回true的每个元素都将从not方法返回的元素集中删除。

hide方法将隐藏设置中剩余的元素。

代码可以这样写，以显示单独的步骤：

if (topic != 'All') {

  var allRows = $('#news').find('tr:has(td)');

  var allRowsExceptTopic = allRows.not(function() {
    return $(this).children(':nth-child(4)').text() == topic;
  });

  allRowsExceptTopic.hide();

}

Answer 2

来自documentation for .not()：

描述：从匹配元素集中删除元素。

因此，为了打破jQuery对象的构建，这里发生了什么：

$('#news') =选择由news
find('tr:has(td)') =选择要素＆＃39; tr个包含td s。
.not( =从集合（已经建立！）中删除与传递给此方法的选择器或对象集匹配的元素。请参阅文档，了解.not的参数可接受的内容。一个是function，用于测试现有集合中的每个元素，并返回true或false以确定是否删除。
function() { return $(this).children(':nth-child(4)').text() == topic; } =测试元素（迭代集合中的每个元素）并返回true（要删除的项目！）如果元素＆＃39;文本与相关主题相匹配。请注意，这只是从集合中删除有问题的元素。其余的都是独自留下的。
.hide() =隐藏集合中剩余的所有内容。

对于它的价值，这在概念上很难理解，因为它使用反向测试来决定事情。

请记住，在第4步中，它会为每个与正确文字不匹配的元素返回false，这会触发.not()仅从集合中删除匹配元素

jQuery的.not（）返回值如何影响.hide（）？

2 个答案: