今天通过 chatgpt 写了一个静态可分页的数据列表,感觉还是挺满意的
以下是 JavaScript 代码片段,完整页面效果可以看看
shuai.la async function getItemsFromFile() {
try {
const response = await fetch('file.txt'); // Update the path to your local text file
const content = await response.text();
const items = content.split('\n').map(item => item.trim());
state.itemsList = items.filter(Boolean); // Filter out empty lines
state.totalItems = state.itemsList.length; // Calculate total items
state.totalPage = Math.ceil(state.totalItems / state.perPage); // Update total page count
list.update();
} catch (error) {
console.error('Error loading file:', error);
}
}
const html = {
get(element) {
return document.querySelector(element);
}
}
const perPage = 10; // Number of items per page
const state = {
page: 1,
perPage,
totalItems: 0, // Initialize total items
totalPage: 0, // Initialize total page count
maxVisibleButtons: 5,
itemsList: []
}
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
https://www.v2ex.com/t/1023404
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.