显示大量单词

Question

我正在开发一个闪存卡应用程序，其数据库超过10,000个单词。我想做的是显示所有单词并有以下三个选项。

1. 显示为列，看起来像

    +--------------------------------+
    |  A       |  word 4  |  C       |
    +--------------------------------+
    +--------------------------------+
    |  word 1  |  B       |  word 7  |
    +--------------------------------+
    +--------------------------------+
    |  word 2  |  word 5  |  word 8  |
    +--------------------------------+
    +--------------------------------+
    |  word 3  |  word 6  |  word 9  |
    +--------------------------------+

2. 显示为按词性分类的表格，类似于

    +---------------------------------------+
    |  Nouns   |  Infinitive  |  Adjective  | ...
    +---------------------------------------+
    +---------------------------------------+
    |  word 1  |  word 1      |  word 1     | ...
    +---------------------------------------+
    +---------------------------------------+
    |  word 2  |  word 2      |  word 2     | ...
    +---------------------------------------+
    +---------------------------------------+
    |  word 3  |  word 3      |  word 3     | ...
    +---------------------------------------+

3. 显示为按细节分类的表格，看起来像

    +------------------------------------------+
    |  words   |  P.O.S      | last seen       | ...
    +------------------------------------------+
    +------------------------------------------+
    |  word 1  |  Noun       |  1 day ago      | ...
    +------------------------------------------+
    +------------------------------------------+
    |  word 2  |  Adjective  |  2 months ago   | ...
    +------------------------------------------+
    +------------------------------------------+
    |  word 3  |  Adverb     |  30 minutes ago | ...
    +------------------------------------------+

我正在寻找一种有效实现这一目标的方法。

• 我应该将所有单词加载到三个单独的div容器中（总共提供30,000个单词）并在它们之间切换显示属性吗？
• 我应该删除当前显示div容器中的所有单词并使用ajax将单词重新添加到所需的div容器中吗？

或者有没有办法加载10,000多个单词，然后相应地重新组织它们？

我该如何处理这项任务？

注意我不是在寻找编码解决方案。

Answer 1

创建具有较少行数的表（但由于滚动，它应足以填满屏幕两次）。滚动时，将表格移动到用户可以看到的位置并用数据填充。