Javascript 随机显示列表项

这一定很简单，但我不能让它工作。 我正在使用Javascript创建测验程序。以下是我的基本标记：

<ul>
<li>option1</li>
<li>option2</li>
<li>option3</li>
</ul>
<ul>
<li>option1</li>
<li>option2</li>
<li>option3</li>
</ul>
....
<ul>
<li>option1</li>
<li>option2</li>
<li>option3</li>
</ul>

但问题是它只适用于第一个ul元素。我想为所有的“ul”元素运行这个脚本

---

有人能告诉我怎么做吗？

你应该查询所有需要的

ul

s，然后迭代它们并应用你的脚本

var ul = document.querySelectorAll('ul');

function haveFun(ul) {
    for (var i = ul.children.length; i >= 0; i--) {
        ul.appendChild(ul.children[Math.random() * i | 0]);
    }
}

Array.prototype.forEach.call(ul, haveFun);

---

您应该查询所有必需的

ul

s，然后迭代它们并应用脚本

var ul = document.querySelectorAll('ul');

function haveFun(ul) {
    for (var i = ul.children.length; i >= 0; i--) {
        ul.appendChild(ul.children[Math.random() * i | 0]);
    }
}

Array.prototype.forEach.call(ul, haveFun);

使用而不是

document.querySelector

。这将为您提供文档中所有

ul

的数组。然后遍历数组，并对每个数组执行您正在执行的操作

var ul = document.querySelectorAll('ul');
for (var ulIndex = ul.length - 1; ulIndex >= 0; ulIndex--) {
    for (var i = ul[ulIndex].children.length; i >= 0; i--) {
        ul[ulIndex].appendChild(ul[ulIndex].children[Math.random() * i | 0]);
    }
}

希望能有帮助。未测试。

使用而不是

文档。querySelector

。这将为您提供文档中所有

ul

的数组。然后遍历数组，并对每个数组执行您正在执行的操作

var ul = document.querySelectorAll('ul');
for (var ulIndex = ul.length - 1; ulIndex >= 0; ulIndex--) {
    for (var i = ul[ulIndex].children.length; i >= 0; i--) {
        ul[ulIndex].appendChild(ul[ulIndex].children[Math.random() * i | 0]);
    }
}

---

希望能有帮助。未测试。

使用

.querySelectorAll

代替（）

下面是实时代码片段：

var-uls=document.querySelectorAll（'ul'）；
对于（var j=0；j=0；i--）{
ul.appendChild（ul.childs[Math.random（）*i|0]）；
}
}

选择1
选择2
选择3


选择1
选择2
选择3


选择1
选择2
选择3

使用

.querySelectorAll

代替（）

下面是实时代码片段：

var-uls=document.querySelectorAll（'ul'）；
对于（var j=0；j=0；i--）{
ul.appendChild（ul.childs[Math.random（）*i|0]）；
}
}

选择1
选择2
选择3


选择1
选择2
选择3


选择1
选择2
选择3