【发布时间】：2019-10-09 22:47:50
【问题描述】：
最近开始通过一个小项目潜入编码。基本上我想显示无限数量的 html 元素的句子（内容），分成 4 个框，然后将框随机排列，并根据当前分钟随机显示其中一个框和不同排序的句子。所以对于像下面这样的元素
<p id="ex1" style="display:none" >The Chop’s popularity in Atlanta won’t soon abate, and even breaks out spontaneously when the Braves rally on the road (often to the irritation of the home team’s fans).</p>
This result should look like this
这是我迄今为止在一个元素的拆分和排序部分自己提出的：
<p id="demo"></p>
<p id="ex1" style="display:none" >{{Ex1}}</p>
<script>
var g1 = document.getElementById("ex1").textContent; ;
var g2=g1.split(" ");
var gx = g2.length;
var g3 = [];
if (gx <= 4) {for(var i = 0; i < g2.length; i += 1){ g3.push (g2.slice(i, i + 1));}}
else if (gx <= 8) {for(var i = 0; i < g2.length; i += 2) { g3.push (g2.slice(i, i + 2));}}
else if (gx <= 12) {for(var i = 0; i < g2.length; i += 3){ g3.push (g2.slice(i, i + 3));}}
else if (gx <= 16) {for(var i = 0; i < g2.length; i += 4){ g3.push (g2.slice(i, i + 4));}}
else if (gx <= 20) {for(var i = 0; i < g2.length; i += 5){ g3.push (g2.slice(i, i + 5));}}
else if (gx <= 24) {for(var i = 0; i < g2.length; i += 6){ g3.push (g2.slice(i, i + 6));}}
else if (gx <= 28) {for(var i = 0; i < g2.length; i += 7){ g3.push (g2.slice(i, i + 7));}}
else if (gx <= 32) {for(var i = 0; i < g2.length; i += 8){ g3.push (g2.slice(i, i + 8));}}
else if (gx <= 36) {for(var i = 0; i < g2.length; i += 9){ g3.push (g2.slice(i, i + 9));}}
else if (gx <= 40) {for(var i = 0; i < g2.length; i += 10){g3.push (g2.slice(i, i + 10));}}
else if (gx <= 44) {for(var i = 0; i < g2.length; i += 11){g3.push (g2.slice(i, i +11));}}
else if (gx <= 48) {for(var i = 0; i < g2.length; i += 12){g3.push (g2.slice(i, i + 12));}}
else if (gx <= 52) {for(var i = 0; i < g2.length; i += 13){g3.push (g2.slice(i, i + 13));}}
else if (gx <= 56) {for(var i = 0; i < g2.length; i += 14){g3.push (g2.slice(i, i + 14));}}
else if (gx <= 60) {for(var i = 0; i < g2.length; i += 15){g3.push (g2.slice(i, i + 15));}}
else if (gx > 60) {for(var i = 0; i < g2.length; i += 20){g3.push (g2.slice(i, i + 20));}}
(function () {
// First sort the array
g3.sort();
// Then reverse it:
g3.reverse(" ");
})();
var g4 = ""
for (var i = 0; i < g3.length; i++) {
g4 = g4 + "<li>" + g3[i] + "</li>"
}
var g5 = g4.replace(/\,/g, ' ');
document.getElementById("demo").innerHTML = g5;
</script>
这是我随机显示元素 ex1 的原始想法：
<script>
var today = new Date();
var random = today.getMinutes()%3 + 1
if (today.getHours() <= 4) {
random -= 1
}
if (random == 1) {
$('#demo').show()
} else if (random == 2) {
$('#demo2').show()
} else {
$('#demo3').show()
}
</script>
我的问题是如何将这些方法扩展到无限（实际上最多 8 个）数量的元素及其句子，例如
<p id="ex1" style="display:none" >The Chop’s popularity in Atlanta won’t soon abate, and even breaks out spontaneously when the Braves rally on the road (often to the irritation of the home team’s fans).</p>
<p id="ex2" style="display:none" >The Chop’s popularity in Atlanta won’t soon abate, and even breaks out spontaneously when the Braves rally on the road (often to the irritation of the home team’s fans).</p>
<p id="ex3" style="display:none" >But his attitude of sullen grievance and simmering fury never abated fully</p>
...
按类（例如 class=examples）对它们进行聚类，然后循环遍历它们？ 任何方法的一个真正重要的条件是，如果随机选择的元素没有内容（句子），则应该显示另一个元素（句子）。除此之外，没有 jQuery 的方法将是完美的。
非常感谢任何帮助。非常感谢您的时间和支持！
【问题讨论】：
-
关于重复代码，循环中使用的数字是
Math.ceil(gx / 4)。
标签： javascript jquery html arrays