Question

Using JavaScript. (I'm using Notepad++)

There are three paragraph elements on the page. They have the following ids: p2 p3 1. Create three variables, with a descriptive name of your choice, that will be used to hold the three paragraph elements in the web page. You will use these variables in step 2. 2. Use the document.getElementByld method to assign the paragraph elements to your three variables. assign the paragraph with the id p1 to your first variable assign the paragraph with the id p2 to your second variable assign the paragraph with the id p3 to your third variable 3. Use the supplied paragraph string constants: PARA1, PARA2, PARA3 to do the following (Do not change the names, and do not modify the text of these constants): 1. Update the paragraph with the id of p1, using its innerHTML property, with the PARA1 string 2. Update the paragraph with the id of p2, using its innerHTML property, with the PARA2 string 3. Update the paragraph with the id of p3, using its innerHTML property, with the PARA3 string constant. Use the variable you used to hold p1 constant.. Use the variable you used to hold p2. constant. Use the variable you used to hold p3.

0 0
Add a comment Improve this question Transcribed image text
Answer #1

Dear Student ,

As per the requirement submitted above , kindly find the below solution.

Here a new web page with name "JavaScriptDemo.html" is created, which contains following code, also this html web page is using javascript file with name "main.js". Following section gives details about each of the above file

JavaScriptDemo.html

<html>

<head>

<!-- title for web page -->

<title> Javascript DOM Manipulation </title>

</head>

<body>

<!-- para1 -->

<p id="p1">Paragraph 1</p>

<!-- para2-->

<p id="p2">Paragraph 2</p>

<!-- para3 -->

<p id="p3">Paragraph 3</p>

<!-- <script> is used to refer to external javascript file -->

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

</body>

</html>

main.js : Following is javascript code for document object manipulation

// declaring three variables in javascript

var HTMLPara1;

var HTMLPara2

var HTMLPara3

// Access DOM element para1 using javascript document.getElementById() method.

// selecting para 1

HTMLPara1 = document.getElementById("p1");

// selecting para 2

HTMLPara2 = document.getElementById("p2");

// selecting para 3

HTMLPara3 = document.getElementById("p3");

//changing text of paragraphs using innerHTML property

//changing text for P1

HTMLPara1.innerHTML = "PARA1";

//changing text for P2

HTMLPara2.innerHTML = "PARA2";

//changing text for P32

HTMLPara3.innerHTML = "PARA3";

=====================================================================================

Output : Open the web page in the browser , will get the screen as shown below

Screen 1 :

Javascript DOM Manipul x JavaScriptDemo.html PARA1 PARA2 PARA3

NOTE : PLEASE FEEL FREE TO PROVIDE FEEDBACK ABOUT THE SOLUTION.

Add a comment
Know the answer?
Add Answer to:
Using JavaScript. (I'm using Notepad++) There are three paragraph elements on the page. They have the...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
  • 5. ///////////////////////////////////////////////// Using javascript Create a paragraph on your page that says “This isn’t even my...

    5. ///////////////////////////////////////////////// Using javascript Create a paragraph on your page that says “This isn’t even my final form!” ( This isn’t even my final form! ). Add a JS mouseover event to that paragraph. When the paragraph has a mouse hovering over it, the text inside should change to “This is my second form!” ( This is my second form! ). Add one more event handler so that when that paragraph is double-clicked, the text will say “THIS is my...

  • Fake News This exercise is about modifying the content of a page in your web browser using Javascript. As we have said, Javascript has access to the current page via the Document Object Model or DOM....

    Fake News This exercise is about modifying the content of a page in your web browser using Javascript. As we have said, Javascript has access to the current page via the Document Object Model or DOM. In your browser, the variable document represents the current document and your code can use it to read and write to the current page. In this exercise we will use the developer tools Javascript console to write Javascript to access parts of the main...

  • This is my code so far: <!DOCTYPE html> <html> <head> <title>JavaScript is fun</title> <meta charset="utf-8" />...

    This is my code so far: <!DOCTYPE html> <html> <head> <title>JavaScript is fun</title> <meta charset="utf-8" /> </head> <body> <script type ="text/javascript"> //declare a variable and store text in it var x = "JavaScript is fun"; //write the variable 5 times document.write(x + x + x + x + x); //store 5 as string in variable x x = "5"; //store 3 as string in variable y var y = "3"; //write the value x + y to the document document.write("<br>");...

  • Write a complete webpage with JavaScript embedded at document level that 1) Read three positive integers...

    Write a complete webpage with JavaScript embedded at document level that 1) Read three positive integers from the user using prompt0 function. You may need use parselnt0 or Number) to convert a string to an integer. 2) Calculate the maximum, the minimum, and the average of above four integers and save them into three variables. 3) Use innerHTML, document.write0, window.alert0 to print the maximum, the minimum, and the average e respectively. 1) Each output statement must be used at least...

  • Create an HTML5 page that contains a form to collect the following data. The text in...

    Create an HTML5 page that contains a form to collect the following data. The text in bold indicates the id value that should be assigned to each html control: Product (drop down list) product – iPad, iPhone 6S, Galaxy 5S, Moto X, and so on Quantity (number) quantity Unit price (number) unit_price Discount (%)(number) discount_rate Date (date)   order_date First Name (text box)   first_name Last Name (text box)   last_name Payment type (drop down list)   payment_type – Visa, Master, Discover, Amex, and...

  • PLEASE HELP: EASY CODE. Using your template create a webpage that contains a div. Give the...

    PLEASE HELP: EASY CODE. Using your template create a webpage that contains a div. Give the body element the id of TOOscary. Give the div the id of ghost. At the bottom of the page (just before the closing body tag) insert a script element. In the script element insert an assignment statement to save the content of the webpage using the variable candy. Hint: candy= document.getElementById(‘TOOscary’).innerHTML; We want to save it so we can bring it back after we...

  • Hart Manufacturing makes three products. Each product requires manufacturing operations in three departments: A, B, and C. The labor-hour requirements, by department, are as follows: Department Pro...

    Hart Manufacturing makes three products. Each product requires manufacturing operations in three departments: A, B, and C. The labor-hour requirements, by department, are as follows: Department Product 1 Product 2 Product 3 A 1.95 3.45 2.45 B 2.90 1.90 3.40 C 0.70 0.70 0.70 During the next production period, the labor-hours available are 540 in department A, 440 in department B, and 140 in department C. The profit contributions per unit are $34 for product 1, $37 for product 2,...

  • I have the code buts its not working as this below instruction can anyone help Use...

    I have the code buts its not working as this below instruction can anyone help Use the requirements from the pizza part of Assignment 6 and do the following using CSS and an internal style sheet: 1.     Your Javascript function should be in an external file (don’t forget to move it up to studentweb too) 2.     Put a red border of 300px in width around the form 3.     There should be three Div sections: header, main_body, and footer. 4.     Center the name of your...

  • **C++** Given three function parameters p1, p2, p3, rotate the values to the right. Rotate means...

    **C++** Given three function parameters p1, p2, p3, rotate the values to the right. Rotate means to shift each item to the item on the right, with the rightmost item rotating around to become the leftmost item. If initial values are 2 4 6, final values are 6 2 4. HINTS Declare the function's three parameters as reference type. Function return type is void. Use a tmp variable in the function (similar to when swapping two variables). Your first assignment...

  • JUDY'S HTML TUTORIAL MENU CREATING YOUR FIRST WEB PAGE The best way to make a web...

    JUDY'S HTML TUTORIAL MENU CREATING YOUR FIRST WEB PAGE The best way to make a web page is to just dive right in. Open Notepad. To open notepad in Windows, click the windows icon in the lower left corner of the screen and then type "notepad." Notepad is a text editor. Other text editors you may consider are TextPad, Sublime Text, or NotePad++. Do not use Word or WordPad; they are word processors. If you are using an Apple computer...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT