> For the complete documentation index, see [llms.txt](https://rpeltz.gitbook.io/introduction-to-web-development/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://rpeltz.gitbook.io/introduction-to-web-development/week-3-javascript-and-html-forms/project-mad-libs.md).

# Project: Mad Libs

Mad Libs is a word game in which the player is asked to fill in the blanks of a story without knowing the story or where the words they enter will end up in the story. The HTML and CSS for this project are provided in the GitHub Repository: <https://github.com/rebeccapeltz/js-event-handling/tree/main>. You can add your code there if you've already imported this into a Replit project for the Dynamic Style Change project. Otherwise, import the GitHub project.

In addition to HTML and CSS, the JavaScript file contains the story template, an interpolated string. It is commented out. The story template references variables that need to be retrieved from the form.

* The **click of the Get Story button** will trigger a click event handler. &#x20;
* The event handler should extract all the data from the form and reference it with variables in the story template.
* Once all the variables are loaded, retrieve the story using the User's input.
* Display the story on the page in the paragraph with ID set to "story".
* Alert the user if they don't enter data in all fields.
* (Optional) Insert four of the underline characters (`____)` for missing words.

<figure><img src="/files/n5VluiwDRF4OXRnfwOA6" alt=""><figcaption><p>Madlib</p></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://rpeltz.gitbook.io/introduction-to-web-development/week-3-javascript-and-html-forms/project-mad-libs.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
