Question

I am working on a word game project. My problem is that I have the game post the word and not the hints (I have them linked to a button) and when I press the button it executes all of the hints and I only want one hint per word. Each word has a hint that is in the same order as each other (i.e hint 0 matches word 0 in the array). There is no CSS because I am focusing on the functionality over styling at the moment. I am also really bad at explaining things and I am open to clarifying anything I might have failed to mention. The code is listed below.

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="stylesheets/main.css">
</head>

<body>
<div class="wrapper">
    <h1>Degrassi Next Class</h1>
    <h2>Word Game</h2>
    <h3> Click on with your mouse or enter a letter with your keyboard to start</h3>
</div>

<div id="simpson"></div>
<br>
<br>
<button id="spoiler">#spoileralert</button>
    <script src="index.js"></script>
</body>

</html>

JS

var degrassi = [
    "Maya", "Zig", "Lola", "Frankie", "Yael", "Tiny", "Zoe", "Tristan", "Grace", "Esme", "Winston", "Hunter", "Vijay", "Rasha", "Goldi", "Jonah", "Baaz", "Miles", "Saad", "Shay"
];


// select a random character
var currentCharacter = degrassi[Math.floor(Math.random() * degrassi.length)];

// the array that loops through characters
var charactersArray = [];
for (var i = 0; i < currentCharacter.length; i++) {
    charactersArray[i] = "_";
}

var lettersLeft = currentCharacter.length;


var simpson = document.getElementById("simpson");
simpson.innerHTML = charactersArray.join(" ");


// hints also knows as spoiler alert
var spoilerz = document.getElementById.spoiler.onclick = function () {
    var spoiler = [
        "Their sister visits from college due to a tragedy",
        "Only character to be in a polyamourus relationship",
        "This character had an abortion",
        "This character has a twin",
        "This character is generqueer",
        "This character was in a gang with his brother",
        "This character was on an actor on West Drive",
        "This character was in a coma after a bus crash",
        "This characters nickname is The Watcher",
        "This character pushed their significant other down a hill",
        "This characters nickname is Chewy",
        "This character caused a school lockdown",
        'First line: "Oh My God! I love high school."',
        "This character was prom queen with their significant other",
        "This character is president of the feminist club",
        "This character has a daughter",
        "This character has an older sister who graduated in 2016",
        "This characters father is abusive",
        "This characters nickname is Creepy Camera Guy",
        "This character was in a love triangle with her best friend"
    ];

    // selects a spoiler this should coorespond with the character
    var currentSpoiler = spoiler[Math.floor(Math.random() * spoiler.length)];


    // loop through spoilers
    var spoilerArray = [];
    for (var i = 0; i < currentSpoiler.length; i++) {
        spoilerArray[i] = "_";
    }

};

How do I loop through an array of my answers and hints in my JavaScript word game?

0 个答案: