合并来自多个页面的 jQuery 对象

Question

我正在创建一个函数，该函数返回跨分页内容的给定选择器的所有元素的 jQuery 对象。const getPagedContent = async (base, selector) => {    let elements = [];    let lastPage = 1;    let page = 0;    while (lastPage > page) {        page++;        let response = await got(`${base}/page/${page}`);        let html = new jsdom.JSDOM(response.body);        elements.push($(html).find(selector));        lastPage = getLastPage(html);    }    return elements;}但是，这确实会返回一个包含所有元素的 jQuery 对象，但（显然）是一个包含多个 jQuery 对象的数组。如何添加每个页面的结果，以便返回一个包含所有元素的 jQuery 对象？编辑： 尝试使用.add返回长度为 0 的 jQuery 对象。我不确定如何为多个 dom 采用添加。const getPagedContent = async (base, selector) => {    let elements = $();    let lastPage = 1;    let page = 0;    while (lastPage > page) {        page++;        let response = await got(`${base}/page/${page}`);        let html = new jsdom.JSDOM(response.body);        elements.add($(html).find(selector));        lastPage = getLastPage(html);    }    console.dir(elements);    console.log('Items length:', elements.length);    return elements;}jQuery {}Items length: 0

Answer 1

您需要使用的确实是 jQuery 的.add(). 当前代码的唯一问题是该.add()方法不会改变调用它的 jQuery 对象，而是返回一个新的 jQuery 对象，其中包含调用者和添加元素的组合内容。

新生成的对象需要像这样分配给调用者：

let elements = $();
elements = elements.add($('some selector'));

下面的代码片段说明了这种方法的一个工作示例。

let elements = $();

for (let i = 0; i < 2; i++) {

    elements = elements.add($(`.outer${i}`).find('.inner'));

}

console.log(elements.length);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="outer0">

    <div class="inner"></div>

</div>

<div class="outer1">

    <div class="inner"></div>

</div>