0

I am attempting to make a random sentence generator that samples in a random adjective, noun, and verb in the appropriate place.

The first time, it generates the sentence perfectly and gives the button to generate again. When I click this button though, nothing happens. I'm not sure why.

It would also be better if on the first generation, on the first button click, the sentence simply is added on to what is already there and the text on the button changes to "Generate another" instead of "Generate a sentence." Then, when you click the button again the sentence should automatically change.

If there is anyone who could study my code and help me but that would be great, thank you:

var nouns = ["girl", "boy", "man", "woman", "animal"];
var adjectives = ["giant", "tiny", "funny", "sad", "strange"];
var verbs = ["jumping", "running", "smiling", "exploding", "dying"];

document.write(
  "Welcome to the Useless Random Sentence Generator! More words and combinations will be added in the future. You can always email liorpoliti24@gmail.com for verb, noun, and adjective suggestions as well as other suggestions to make this generator better. Click the button to begin."
);

function randIndex() {
  var randIndex = Math.floor(Math.random() * 5);
  var noun = nouns[randIndex];
  var adjective = adjectives[randIndex];
  var verb = verbs[randIndex];
  var result = "The " + adjective + " " + noun + " is " + verb + ".";
  document.write(result);

  elem = document.createElement("hr");
  elem.setAttribute("width", "500px");
  elem.setAttribute("legth", "8000px");
  document.body.appendChild(elem);

  const btn = document.createElement("button");
  btn.innerText = "Generate Another";
  document.body.appendChild(btn);
  btn.innerText = "Generate Another";
  btn.addEventListener("click", () => {
    randIndex();
  });
}
<button onclick="randIndex();">
   Generate Random Sentence
</button>

2 Answers 2

0

This works:

    var nouns = ["girl", "boy", "man", "woman", "animal"];
    var adjectives = ["giant", "tiny", "funny", "sad", "strange"];
    var verbs = ["jumping", "running", "smiling", "exploding", "dying"];

    function randIndex() {
      var randIndex = Math.floor(Math.random() * 5);
      var noun = nouns[randIndex];
      var adjective = adjectives[randIndex];
      var verb = verbs[randIndex];
      var result = "The " + adjective + " " + noun + " is " + verb + "."
      var li = document.createElement("li");
      li.innerHTML = result;
document.getElementById("result").appendChild(li);

document.getElementById("generateButton").value = "Generate another";
    }
<div>
"Welcome to the Useless Random Sentence Generator! More words and combinations will be added in the future. You can always email liorpoliti24@gmail.com for verb, noun, and adjective suggestions as well as other suggestions to make this generator better. Click the button to begin."
</div>
<ul id="result"></ul>
    <input type="button" id="generateButton" onclick="randIndex();" value="Generate Random Sentence" />

1
  • This works great, thanks so much. One issue though, is that as you click the button it moves down making it harder to click multiple times. I got another answer that fixed this though, thanks fr the fast reply anyway. Apr 10, 2020 at 22:54
0

Welcome Paradox Blu! Pretty good start. Enough info to permit effective helping!

How about this? I've taken the liberty to add a bit more of the HTML context, among other things.

The initial div element seems a better approach than using document.write(), which is not held in high esteem these days, I believe.

I gave the button element (and the ul element) ids because it's fairly easy to use JS functions (like document.getElementById) to identify and manipulate that way.

The ul element could have been a regular div, section - pretty much anything. ul elements naturally contain a bunch of li elements, so that seemed to fit.

You already created and appended some new button elements in your own code, so I don't suppose I have to say much about that.

<div>
  <p>Welcome to the Useless Random Sentence Generator!
     More words and combinations will be added in the
     future. You can always email for verb, noun, and
     adjective suggestions as well as other suggestions
     to make this generator better.
     Click the button to begin.</p>
</div>

<button id="btn" onclick="randIndex();">
    Generate Random Sentence
</button>

<ul id="sent">
</ul>

Then later, in the script section:

const nouns = ["girl", "boy", "man", "woman", "animal"];
const adjectives = ["giant", "tiny", "funny", "sad", "strange"];
const verbs = ["jumping", "running", "smiling", "exploding", "dying"];


function randIndex() {
    const randIndex = Math.floor(Math.random() * 5);
    const noun = nouns[randIndex];
    const adjective = adjectives[randIndex];
    const verb = verbs[randIndex];
    const btn = document.getElementById('btn');
    const sent = document.getElementById('sent');
    const result = "The " + adjective + " " + noun + " is " + verb + ".";

    const newLI = document.createElement("li");
    newLI.innerText = result;
    sent.appendChild(newLI);
    btn.innerText = "Generate Another";
}

I should probably add a shot of what the output looks like, quick and dirty though it is: after clicking the button a few times

4
  • Hi there. Thank you so much for your fast reply, it works perfectly. I am wanting to improve my coding skill so I would like to know the changes you made and why you made them. I struggle to understand the getElementById things and other element things, if you could explain everything you did to make this work to me that would be helpful. I am a beginner and dont know mmuch about getElementById and other things you can do with "elements." Annyway, thanks so much for your reply I am excited fr your reply Apr 10, 2020 at 22:58
  • Hi Paradox Blu. I'll give it a go. I think it'd work best in the answer, so I'll go there if I can.
    – user10987633
    Apr 11, 2020 at 1:55
  • You are welcome. It might help for you to accept an answer, once you are satisfied with whichever answer you have selected.
    – user10987633
    Apr 11, 2020 at 15:18
  • I apologize, I am new to this site. I have done so now :D Apr 11, 2020 at 15:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.