如何将第一个项目加载到一个地方，将其他项目加载到其他地方

Question

我有一个文档，我将外部列表中的前五个项目加载到Div＃Reports。

$("#reports").load("website.com/reports-list.html .report-item:lt(5)"); 我如何在该列表中加载下一个（x）数字项，或者，或者，该数字中的其余项目中的其余项目中的div＃more-moreports？

Answer 1

lt

，请参阅：

let template = "";
for (let i = 0; i < 100; i++) {
    template += `<span class="report-item">${i}&nbsp;</span>`;
}
document.getElementById("input").innerHTML = template;
function loadMore() {
    let output = document.getElementById("output");
    let offset = output.children.length;
    $("#output").append($("#input span.report-item:lt(10)"));
}
//$("#reports").load("website.com/reports-list.html .report-item:lt(5)");

#input span {
    color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<div id="output"></div>
<input type="button" value="Load More" onclick="loadMore()">
<div id="input"></div>