Javascript 一次显示容器中的随机div

我想做一些类似于通知消息的事情

首先，我实现了一个无限循环，但这并不完美，所以我只想以随机顺序显示容器的每个div一次。当显示容器的所有div时，它应该简单地停止

但我不知道，如何设置一个类似列表的东西，应该随机处理然后停止

这是我的密码：

var-myVar；
函数showDiv（）{
var random=Math.floor（Math.random（）*$（'.notification'）.length）；
$（'.notification'）.eq（随机）.prependTo（'.container'）.animate({
不透明度：1，//设置幻灯片的动画
marginLeft:'30px'
}延迟（3000）。衰减（400）；
createRandomInterval（）；
}
函数createRandomInterval（）{
setTimeout（showDiv，500+Math.random（）*4000）；
}
$（文档）.ready（函数（）{
createRandomInterval（）；
});
。通知{
宽度：200px；
高度：50px；
背景颜色：黄色；
边框：1px实心rgba（0,0,0,0.2）；
边缘底部：5px；
文本对齐：居中；
填充顶部：20px；
不透明度：0；
}

1.
2.
3.
4.
5.
6.
7.
8.
9
10
我想这就是你想要的：

只需将元素存储在数组中，并在追加元素后将其从数组中删除即可


var arr=$（“.notification”）；
函数显示（）{
设rand=Math.floor（Math.random（）*arr.length）
arr.eq（rand）.prependTo（“结果”）.animate({
不透明度：1，//设置幻灯片的动画
marginLeft:'30px'
}延迟（2000），衰减（400）；
arr=arr.not（“：eq（“+rand+”）”）
如果（arr.length>0）createRandomInterval（）；
}
函数createRandomInterval（）{
setTimeout（显示，500+数学随机（）*4000）；
}
createRandomInterval（）
。通知{
背景色：红色；
显示器：flex；
证明内容：中心；
对齐项目：居中；
高度：50px；
宽度：200px；
边缘底部：10px；
不透明度：0
}
.隐藏{
显示：无；
}

对象1
对象2
对象3
对象4
维护一个数组，然后查找已访问的节点

 for ( i in $('.notification') ) {
   if (arr.length ===  $('.notification').length) {
      console.log("all are shown")
    } else {  
        setInterval(showDiv, 500 + Math.random() * 4000);
    }
  }

根据通知创建阵列，然后为该阵列的唯一编号创建函数。基本上，当从数组中取出数字时，可以使用
splice
和
indexOf
来实现这一点。您也可以使用
过滤器
来实现它。嘿，谢谢。但是现在所有的div都同时隐形了。每个fadein之间的随机时间不再活动，或者？嗨，我试图在这里面恢复我的动画，但是我的技能太低了。你能帮我把它们放回你的代码中吗？我回到这里：-但是我的.animate、.delay和.fadeout不见了，我不知道如何把它们放回去：（把它放在同一个地方。看编辑