How do I write a conditional that makes it so that the event target is specifically applied only to the input elements?

Question

The challenge asks that you add to the code already in place, so I'm not sure how to implement a conditional that would single out strictly the input elements here.

app.js

let section = document.getElementsByTagName('section')[0];

section.addEventListener('click', (e) => {
  e.target.style.backgroundColor = 'rgb(255, 255, 0)';
});

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>JavaScript and the DOM</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <section>
            <h1>Making a Webpage Interactive</h1>
            <p>JavaScript is an exciting language that you can use to power web servers, create desktop programs, and even control robots. But JavaScript got its start in the browser way back in 1995.</p>
            <hr>
            <p>Things to Learn</p>
            <ul>
                <li>Item One: <input type="text"></li>
                <li>Item Two: <input type="text"></li>
                <li>Item Three: <input type="text"></li>
                <li>Item Four: <input type="text"></li>
            </ul>
            <button>Save</button>
        </section>
        <script src="app.js"></script>
    </body>
</html>

Answer 1 · 2020-04-18T16:08:26Z

April 18, 2020 4:08pm

Adding a conditional to the body code would look like this:

  If (/*your_conditional_expression_here*/) {      // <-- add this line
    e.target.style.backgroundColor = 'rgb(255, 255, 0)';
  }                                                // <-- and this one

And for your conditional expression, you might compare the "tagName" property of the target with "INPUT" (since tag names are always stored in upper case).

Welcome to the Treehouse Community

Looking to learn something new?

jscogg

jscogg

How do I write a conditional that makes it so that the event target is specifically applied only to the input elements?

1 Answer

Steven Parker

Steven Parker