Question

In: Computer Science

This should be done in JavaScript. The HTML file should only contain an empty main tag....

This should be done in JavaScript. The HTML file should only contain an empty main tag. All other HTML on the page should be created with JavaScript. The JavaScript file should be a separate file.  

  • Make an empty HTML file, put an empty main tag inside the body.
  • In your JavaScript, use querySelector to get a reference to the main tag and save it in a variable named main.
  • Look up three good jokes and store them as separate variables in your JavaScript.
  • Define an HTML template with a template string. Make a heading for your template that says "My Jokes" and make a list of your three jokes, inserting the variables as items in the list.
  • Put the template inside the main tag.
  • Make a paragraph tag with the document.createElement method and save it to a variable.
  • Add the text "That's all folks!" as text content to the newly created paragraph tag.
  • Append the paragraph tag to the body tag of your HTML page.

Solutions

Expert Solution

temp.htm

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <main></main>

    <script src="./temp.js"></script>

</body>

</html>

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

temp.js

const main = document.querySelector('main');

//jokes

const joke1 = `What do you call a crying sister? A crisis`;

const joke2 = `I have a joke on black hole but it sucks`;

const joke3 = `What do we call a bee born in United States? A USB`;

//template html string

const template = `<h3>My Jokes</h3>

<ul>

<li>${joke1}</li>

<li>${joke2}</li>

<li>${joke3}</li>

</ul>`;

//set main to template

main.innerHTML = template;

//create paragraph and text node

const para = document.createElement('p');

const text = document.createTextNode("That's all folks!");

para.appendChild(text);

document.body.appendChild(para);


Related Solutions

Write a log-in log-out session using PHP, CSS, and HTML only. NO MYSQL and JavaScript allowed....
Write a log-in log-out session using PHP, CSS, and HTML only. NO MYSQL and JavaScript allowed. 1. Need an HTML form and a login form; separate file. 2. need a CSS file to make it look good 3. Must store visitors' info in a .txt file and validate from there if the user exists before granting access to the dashboard. If the user does not exist, render the form to signup. If the user exists take them to their dashboard....
HTML document containing a form. The title bar should display “Voting Form”. The form should contain...
HTML document containing a form. The title bar should display “Voting Form”. The form should contain the following: Text boxes to accept the person’s name and e-mail address At least five radio buttons the user can use to vote for a candidate for some office. (You make up some names) Text box for write-in alternative Checkboxes with name and value attributes for these options: oThis is the first time I have voted online. o I have periodically voted online. o...
HTML Create a page of texts that uses inline elements. The page should contain a citation,...
HTML Create a page of texts that uses inline elements. The page should contain a citation, a term definition, a subscript, a superscript and some highlighted texts.
Write a C++ program to create a text file. Your file should contain the following text:...
Write a C++ program to create a text file. Your file should contain the following text: Batch files are text files created by programmer. The file is written in notepad. Creating a text file and writing to it by using fstream: to write to a file, you need to open thew file as write mode. To do so, include a header filr to your program. Create an object of type fsrteam. Open the file as write mode. Reading from a...
C++ If you tried to compile a source file that doesn't contain a main() function, would...
C++ If you tried to compile a source file that doesn't contain a main() function, would this error be detected by the preprocessor, the compiler, or the linker? Briefly justify your answer. Hint: think about how the files that don't have main() get processed in a project with multiple files. Alternatively, try it out and look at the error message you get.
Assume you already have a non-empty string S, which is guaranteed to contain only digits 0...
Assume you already have a non-empty string S, which is guaranteed to contain only digits 0 through 9. It may be of any length and any number of digits may occur multiple times. Starting from the front of the string, write a loop that jumps through the characters in the string according to the following rule: Examine the current character and jump that many characters forward in the string Stop if you jump past the end of the string, or...
it should be done in libre office Create a new presentation – Click File -> New-...
it should be done in libre office Create a new presentation – Click File -> New- > Presentation then select ForestBird template. Activate slide pane by clicking on View tab then Slide Pane. Right click on the first slide on the slide pane and click on Layout then select Title Only layout. In the title box, type – Getting started with Impress Right click on the title box and change the alignment to Centre Delete other slides from Slide Pane...
Using C++ 1. Create a main function in a main.cpp file. The main function should look...
Using C++ 1. Create a main function in a main.cpp file. The main function should look as follows int main() {return 0;} 2. Create an array. 3. Ask user to enter numbers in size of your array. 4. Take the numbers and store them in your array. 5. Go through your array and add all the numbers. 6. Calculate the average of the numbers. 7. Display the numbers, sum and average.
The R-rule for oysters is that you should only eat them in months that contain the...
The R-rule for oysters is that you should only eat them in months that contain the letter R. Assuming that you like to get oysters on Saturday evenings with your friends write a program that uses the year as an input to determine how many times in that year you can get an oyster dinner and make a list of those dates for that year. Do this in a fully automated way and include a consideration of leap-years. In other...
Create an outline of your project (1 page). The outline should only contain topic headings and...
Create an outline of your project (1 page). The outline should only contain topic headings and a brief description of what it will cover. See the link below for an APA formatted outline. Remember that your outline will be a guide as you write your paper to keep you on topic and organized. Required paragraph topics include but are not limited to: the role nutrition plays in the prevention of the disease, etiology, progression, treatment, recommended diets, nursing assessment, nursing...
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT