函数能正常执行并返回数组，但无法在页面中显示，根本原因在于 return 仅向调用者传递值，不会自动更新 dom；需显式将返回结果渲染到 html 元素中。
要实现“点击按钮加载下一页数据并显示”，关键在于：函数必须返回数据，同时在调用后立即将其插入页面。你当前的 nextTwo() 确实正确返回了切片后的数组（如 [11, 12, ..., 20]），但 onclick="nextTwo()" 仅执行函数，却丢弃了返回值——它既未被接收，也未被用于更新界面。
✅ 正确做法：接收返回值 + 渲染到 DOM
首先，确保目标容器存在（例如一个
- ）：
<ul id="item_list"></ul> <button id="next" onclick="nextTwo()">显示下10项</button>
然后修改函数，在返回数据的同时，也完成 DOM 更新（推荐方式）：
const objList = [
{ id: 1, name: "Item 1" }, { id: 2, name: "Item 2" },
// ... 共20个对象（示例略）
{ id: 20, name: "Item 20" }
];
function nextTwo() {
const page = 2; // 固定为第2页 → 显示第11–20项
const step = 10;
const start = (page - 1) * step; // 更直观：第1页从0开始，第2页从10开始
const end = start + step;
const nextItems = objList.slice(start, end);
// ✅ 步骤1：更新页面（关键！）
const container = document.getElementById('item_list');
if (container) {
container.innerHTML = nextItems
.map(item => `<li>${item.name} (ID: ${item.id})</li>`)
.join('');
}
// ✅ 步骤2：仍可返回（便于测试或链式调用）
return nextItems;
}? 提示：原逻辑 start = page * step - step 等价于 (page - 1) * step，后者语义更清晰，也避免 page = 0 时出错。
⚠️ 常见错误排查
- 拼写错误：document.getElementbyId ❌ → 正确是 document.getElementById（大小写敏感）；
- 元素不存在：确保 HTML 中 id="item_list" 的元素已加载（脚本放在
