Javascript 显示随机Div

我正在尝试为我的主页随机加载这些div。我有一些特定的css，这使它很难，否则我会做随机图像的众多建议之一。谢谢你的帮助

<div class="banner-images">

<div class="feature" style="background-image: url(images/typewriter.png)">
    <img  class="hero-poster" src="images/typewriter.png" />

    <div class="hero-decoration">
        <div class="side-l"></div>
        <div class="arrow"><img alt="Hero-triangle" src="images/triangle.png" /></div>
        <div class="side-r"></div>
    </div>
</div>

<div class="feature" style="background-image: url(images/printing.png)">
    <img  class="hero-poster" src="images/printing.png" />

    <div class="hero-decoration">
        <div class="side-l"></div>
        <div class="arrow"><img alt="Hero-triangle" src="images/triangle.png" /></div>
        <div class="side-r"></div>
    </div>
</div>

<div class="feature" style="background-image: url(images/newspaper.png)">
    <img alt="Releaser" class="hero-poster" src="images/newspaper.png" />

    <div class="hero-decoration">
        <div class="side-l"></div>
        <div class="arrow"><img alt="Hero-triangle" src="images/triangle.png" /></div>
        <div class="side-r"></div>
    </div>
</div>
</div>

---

以下是一种方法：

$(document).ready(function() {
    var rand = Math.floor(Math.random()*3);
    var visibleDiv = $('.feature')[rand];
    $(visibleDiv).show();
});

生成一个随机数，然后显示与该数一致的元素

---

我使用了一个我在网上找到的随机数组洗牌函数，因为我不想写一个，但这是一个不错的方法。基本上，您将获取

$（'.feature'）

数组并将其洗牌，然后按随机顺序显示它们

看起来像：

$(function() {
    var shuffle = function(o){
        for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
        return o;
    }
    var showArr = shuffle($('.feature'));
    $.each(showArr, function(k,v) { //key, value
        window.setTimeout(function() {
            $(v).css('opacity', 1);
        },k*1000);
    });
});

在这里查看并使用它：

---

同样，这只是一个基本的解释。你可以多玩一点，让它更漂亮等等。

你特别想随机选择哪个

呢？你是想随机选择顺序还是随机显示其中一个？标题和问题似乎在问两个不同的问题：完美。干得好！