Scribd Logo
Upload

Welcome to Scribd!

  • 1 views

    Ips 13 3 2024

    Uploaded by

    bbuli0510

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Ips 13 3 2024

    Uploaded by

    bbuli0510
    1 views3 pages

    Original Title

    IPS_13_3_2024

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    1 views3 pages

    Ips 13 3 2024

    Uploaded by

    bbuli0510

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 3

    Exercise 1

    Given the following HTML structure:

    <!DOCTYPE html>

    <html>

    <head>

    <title>DOM Exercise</title>

    </head>

    <body>

    <div id="container">

    <p>This is a paragraph.</p>

    <ul>

    <li>Item 1</li>

    <li>Item 2</li>

    <li>Item 3</li>

    </ul>

    <button id="btn">Click Me</button>

    </div>

    </body>

    </html>

    Write JavaScript code to accomplish the following tasks:

    1. Change the text content of the <p> element to "Updated paragraph".


    2. Add a new <li> element with the text "Item 4" to the <ul> element.
    3. Change the background color of the <button> element to "green" when clicked.

    Exercise 2

    Given the following HTML structure:

    <!DOCTYPE html>

    <html>

    <head>
    <title>DOM Exercise</title>

    </head>

    <body>

    <div id="container">

    <input type="text" id="nameInput" placeholder="Enter your name">

    <button id="submitButton">Submit</button>

    <p id="greetingMessage"></p>

    </div>

    </body>

    </html>

    Write JavaScript code to accomplish the following tasks:

    1. When the user clicks the "Submit" button, retrieve the value entered into the text input.
    2. Use the retrieved value to update the text content of the <p> element with the id
    "greetingMessage" to say "Hello, [name]!" where [name] is the value entered by the user.

    Exercise 2

    Given the following HTML structure:

    <!DOCTYPE html>

    <html>

    <head>

    <title>DOM Exercise</title>

    </head>

    <body>

    <div id="container">

    <ul id="list">

    <li>Apple</li>

    <li>Orange</li>

    <li>Banana</li>
    </ul>

    <button id="removeButton">Remove First Item</button>

    </div>

    </body>

    </html>

    Write JavaScript code to accomplish the following tasks:

    1. When the "Remove First Item" button is clicked, remove the first <li> element from the <ul>
    element with the id "list".
    2. Ensure that the removal of the first item does not cause any errors if the list is empty.

    You might also like