Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) Getting a Handle on the DOM Selecting by Id

Posted by Adam Fields
Adam Fields
4,487 Points

There is a variable named button in app.js. Set its value to contain a reference to the button element in index.html wit

I am not sure how to answer this

js/app.js 
let button;
let input;
button.addEventListener('click', () => {
  alert(input.value);
 button.document.getElementById="button";
});
index.html 
<!DOCTYPE html>
<html>
  <head>
    <title>Phrase Sayer</title>
  </head>
  <body>
    <p><input type="text" id="phraseText"></p>
    <p><button id="sayPhrase">Say Phrase</button></p>
    <script src="js/app.js"></script>
  </body>
</html>

1 Answer

matt mccherry
matt mccherry
4,493 Points
matt mccherry
matt mccherry
4,493 Points

Q. There is a variable named button in app.js. Set its value to contain a reference to the button element in index.html with the ID of sayPhrase.

So let's break the question down first, what is it asking?

// 1) There is a variable named button in app.js. (let's locate this)

let button; //here it is right at the top
let input;

button.addEventListener('click', () => {
  alert(input.value);
});
// this EventListener is on the button, so the button must be an element
// in our HTML

// 2) Set its value to contain a reference to the button element in index.html 
//  with the ID of sayPhrase.

// so we need the var button = the button that we want the Event on, 
// to know we have the right button it must have the id sayPhrase

// your code 
button.document.getElementById="button";
// was actually really close.
// the only thing is we want the variable button to = Element
// so...

let button = document.getElementById('sayPhrase'); 
let input;             
// The variable button = The element that has an id of sayPhrase. 
// The only element that does is the button that we want to have the event listener on!

button.addEventListener('click', () => {
  alert(input.value);
});