javascript - 为每个 img 分配一个不同的随机类

Question

现在这段代码为所有 imgs 提供了相同的随机类。
我怎样才能给每张图片一个不同的随机类别？

感谢您的帮助。

$(document.body).ready(function () {
    bgImageTotal = 5;
    randomNumber = Math.round(Math.random() * (bgImageTotal - 1)) + 1;
    $('img').addClass('img' + randomNumber);
});

.img1{max-height:10px}
.img2{max-height:40px}
.img3{max-height:70px}
.img4{max-height:100px}
.img5{max-height:130px}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="http://i.imgur.com/YeDYzSR.png">
<img src="http://i.imgur.com/YeDYzSR.png">
<img src="http://i.imgur.com/YeDYzSR.png">
<img src="http://i.imgur.com/YeDYzSR.png">
<img src="http://i.imgur.com/YeDYzSR.png">
<img src="http://i.imgur.com/YeDYzSR.png">

Answer 1

循环，生成随机数，赋值:

$(document.body).ready(function () {
    var bgImageTotal = 5;
    $('img').each(function() {
        var randomNumber = Math.round(Math.random() * (bgImageTotal - 1)) + 1;
        $(this).addClass('img' + randomNumber);
    });
});

您的问题是 $('img') 将返回所有图像 - 之后，您必须循环它们并将类分别分配给每个图像。