javascript - 选择随机数组，然后选择该数组中的一个元素

Question

我试图弄清楚是否可以首先选择一个随机数组(加载时)，然后选择该数组中的一个元素。例如我有:

    var colorsOne = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsTwo = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsThree = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsFour = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsFive = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsSix = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsSeven = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsEight = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsNine = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsTen = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsEleven = ["#CCCCCC","#333333","#990099","#990099"];  
    var colorsTwelve = ["#CCCCCC","#333333","#990099","#990099"];  

12 个数组(每个数组最终都会填充不同的十六进制代码)，我首先需要选择其中一个数组，然后从此数组中选择一个十六进制代码(随机)。

例如

var rand = Math.floor(Math.random() * 4);               
$('.header-wrap').css("background-color", colorsEight[rand]);

这将从 coloursEight 数组中获取一个随机元素，但我必须对其进行编程，我需要首先随机选择一个数组，然后从此数组中选择一个元素。

对此的任何建议将不胜感激!

Answer 1

答案几乎是问题本身固有的。 :-) 将数组放入数组中，然后执行与您所做的相同的操作:

var colors = [
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"],
    ["#CCCCCC","#333333","#990099","#990099"]
];

var array = colors[Math.floor(Math.random() * colors.length)];
var color = array[Math.floor(Math.random() * array.length)];
$('.header-wrap').css("background-color", color);

如果由于某种原因您需要这些单独的数组变量，您仍然可以将它们收集在一起:

var colorsOne = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsTwo = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsThree = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsFour = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsFive = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsSix = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsSeven = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsEight = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsNine = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsTen = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsEleven = ["#CCCCCC","#333333","#990099","#990099"];  
var colorsTwelve = ["#CCCCCC","#333333","#990099","#990099"]
var colors = [
    colorsOne,
    colorsTwo,
    colorsThree,
    colorsFour,
    colorsFive,
    colorsSix,
    colorsSeven,
    colorsEight,
    colorsNine,
    colorsTen,
    colorsEleven,
    colorsTwelve
];

var array = colors[Math.floor(Math.random() * colors.length)];
var color = array[Math.floor(Math.random() * array.length)];
$('.header-wrap').css("background-color", color);