как мне рандомизировать цвет границы div, которые у меня есть после запуска цикла while, потому что когда я получил и использовал это
<script>
$(document).ready(function(){
var array = ["orange", "blue", "black", "yellow", "green"];
var colorNumber = Math.round((Math.random() * (array.length - 1)));
$(".booty").css('border-color', array[colorNumber]);
//$('h1').css("color", colors[rand]);
});
</script>
и использовал его для рандомизации
<div class = "media booty">
</div
Я получаю те же цвета границы вместо первого div, синий, затем следующий черный div, затем следующий зеленый div, пожалуйста, как мне решить эту проблему.
Не используйте Math.round
при попытке сгенерировать случайное число в диапазоне массива - иначе вверх может округляться до длины массива, и доступ к этому индексу приведет к undefined
. Вместо этого используйте Math.floor
.
Вам нужно будет генерировать новый случайный цвет при каждой итерации, иначе все они будут одинаковыми:
const colors = ["orange", "blue", "black", "yellow", "green"];
$(".booty").each((_, div) => {
const colorNumber = Math.floor((Math.random() * (colors.length)));
$(div).css('border-color', colors[colorNumber]);
});
.media {
border: 1px solid;
}
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "media booty">text</div>
<div class = "media booty">text</div>
<div class = "media booty">text</div>
<div class = "media booty">text</div>