Html 随机选择固定数量的列表项？

我正在创建一个记忆游戏，用户必须将一张卡上的单词与其在另一张卡上的定义相匹配

目前，我有一个列表中的所有内容，单词/定义通过相同的类名链接在一起

<li class="match1"> 1 </li>
<li class="match2"> Two </li>
<li class="match1"> One </li>
<li class="match2"> 2 </li>

1
两个
一个
2

我的问题是，既然我不想每次都出现相同的单词，我该如何从更多的类名中随机选择几个不同的类名出现在页面上呢

例如，如果我想让上面的代码增加到50，但一次只显示6个不同的单词

---

我只是以“1”和“1”为例，如果有什么关系，我实际上会使用词汇表和定义。

假设您继续使用类命名约定-

放置

li{display:none；}

以预隐藏所有选项，然后：

//Set these as you wish
var totalOptions = 50, showOptions = 6, random;

//Loop this code as many times as the value of showOptions
for (var i = 0; i < showOptions; i++) {

    //Generate a random number between 1 and the value of totalOptions
    do {
        random = 1 + Math.floor(Math.random()*totalOptions);
    }
    //Loop while the chosen value is something already shown
    while (document.getElementsByClassName('match' + random)[0].style.display == 'list-item');

    //Hide word && definition by class name
    document.getElementsByClassName('match' + random)[0].style.display = 'list-item';
    document.getElementsByClassName('match' + random)[1].style.display = 'list-item';

}

//根据需要设置这些
var totalOptions=50，showOptions=6，随机；
//循环此代码的次数与showOptions的值相同
对于（变量i=0；i

---

您是否意识到需要Javascript或PHP或C#等服务器端语言？对于服务器端方法，这是一个很小的问题，Javascript只是稍微难一点。我只是想知道这样做最有效的方法是什么。