如果可能的话，我需要帮助了解这个jQuery过滤器函数是如何工作的，逐行工作

I need help understanding how this jQuery filter function works, line-by-line, if possible

本文关键字：工作 过滤器 函数 何工作 逐行 jQuery 如果 了解 帮助      更新时间：2023-09-26

这是 HTML：

<div>
    <h3>text</h3>
</div>
<div>
    <h3>moretext</h3>
</div>
<div>
    <h3>123</h3>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

这是JS：

var rv1_wlength = $("div").filter(function() {
    return $(this).find("h3").filter(function () {
        return $(this).text() != "123";
    }).length;
});
var rv1_wolength = $("div").filter(function() {
    return $(this).find("h3").filter(function () {
        return $(this).text() != "123";
    });
});
var rv2 = $("div").find("h3").filter(function() {
    return $(this).text() != "123";
});
alert(rv1_wlength.text());   // text
                             // moretext
alert(rv1_wolength.text());  // text
                             // moretext
                             // 123
alert(rv2.text());​           // textmoretext

我不明白为什么前两种方法在每行上打印元素，而第二种方法将它们连接起来。 rv2是一个jQuery对象。 那么，前两个（rv1_wlength和rv1_wolength）是什么？

此外，我不明白为什么包含长度属性会在过滤元素时产生所有差异。 第二个方法不执行任何操作，因为它返回所有元素。 第一种方法（唯一的更改是添加了 length 属性）可以正确筛选元素。 我非常想要逐行解释。

我将真诚地感谢任何反馈。 谢谢。

此代码获取包含至少一个文本未"123" h3的所有div 元素。

var rv1_wlength = $("div").filter(function() {
    return $(this).find("h3").filter(function () {
        return $(this).text() != "123";
    }).length;
});

这段代码是无用的：

var rv1_wolength = $("div").filter(function() {
    return $(this).find("h3").filter(function () {
        return $(this).text() != "123";
    });
});

这将返回原始选择，$('div')，因为回调函数总是返回一个真值（空的jQuery集仍然被认为是真值）。

最后，此代码获取文本未"123"的所有 h3 元素：

var rv2 = $("div").find("h3").filter(function() {
    return $(this).text() != "123";
});

调用 .text() 时，jquery 会连接所选内容中所有元素的文本。在第一种情况下，这是连接包含换行符的div 中的文本。在第二个中，它连接了 h3 中的文本，而没有。

在

<h3>元素之外但在<div>元素内部存在带有换行符的文本节点。换行符会导致 alert() 放置的对话框中出现换行符。 当您只获取<h3>内容时，没有换行符。

相关文章：