获取object.properties并将其随机放置在dom元素中.小香草



我正在创建智力竞赛游戏。我有一个单独的.js文件,里面有一组问题对象,比如:

var questions = [
{
ask: "question",
choice1: "answer",
choice2: "answer",
choice3: "answer",
correct: "correct answer"
},
];

然后我从数组中得到随机对象:

let random = questions[Math.floor(Math.random() * questions.length)];

然后我可以像这样将这些object.properties发送到dom:

question.innerHTML = random.ask
answer1.innerHTML = random.choice1;
answer2.innerHTML = random.choice2;
answer3.innerHTML = random.choice3;
answer4.innerHTML = random.correct;

一切都很好,但我需要把这些答案随机化。每次正确的答案都在同一个地方,但我需要答案和正确的答案在dom中随机出现。

我陷入了这个问题,尝试了在谷歌上找到的所有解决方案,但都没有成功。

您可以使用相同的逻辑来随机化选择。可以做到这一点的方法之一如下:

var questions = [
{
ask: "question",
choice1: "answer 1",
choice2: "answer 2",
choice3: "answer 3",
correct: "correct answer"
},
];
let random = questions[Math.floor(Math.random() * questions.length)];
console.log(random);
// Make an array of choices key
let choices = [];
Object.keys(random).forEach((item, index) => {
if(key !== "ask") {
choices.push(random[item]);
}
});
console.log(choices);
function getRandomAnswer() {
// Get a random number
let randomNum = Math.floor(Math.random() * choices.length);
// Store random answer in a variable
let answer = choices[randomNum];
// Remove used up answer from choices array
choices.splice(randomNum, 1);
return answer;
}
console.log("Random Answer: ", getRandomAnswer());
console.log("Random Answer: ", getRandomAnswer());
console.log("Random Answer: ", getRandomAnswer());
console.log("Random Answer: ", getRandomAnswer());

我也做了一个jsFiddle。您可以根据需要对此进行优化。希望它能有所帮助!

最新更新