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) Making Changes to the DOM Modifying Elements

Trevor Osterman
Trevor Osterman
4,016 Points
Posted by Trevor Osterman
Trevor Osterman
4,016 Points

I'm so lost

I'm being told to select the input element with the ID "linkName", and I don't know why the following declaration isn't selecting the input element:

var inputValue = document.querySelector("#linkName");

or

var inputValue = document.querySelector("input #linkName");

My thinking according to the refresher video linked in the challenge is that by altering the line of code to:

var inputValue = document.querySelector("#linkName".value);

Then I should get the value and store it back into the inputValue variable, but it's not working.

I feel like the code challenges went from way too easy, to assuming we know more than we've been taught yet, requiring me to try and understand MDN articles on stuff that's way over my head. Also, why are we still using the "var" keyword after just being taught to use "const" and "let" in a previous lesson? What's going on here?

app.js 
var inputValue = document.textContent("input #linkName");
index.html 
<!DOCTYPE html>
<html>
    <head>
        <title>DOM Manipulation</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <div id="content">
            <label>Link Name:</label>
            <input type="text" id="linkName">
            <a id="link" href="https://teamtreehouse.com"></a>
        </div>
        <script src="app.js"></script>
    </body>
</html>

2 Answers

Antony .
Antony .
2,824 Points
Antony .
Antony .
2,824 Points

For this line of code you need to add the propertyvalue at the end 

var inputValue = document.querySelector("#linkName");

//Like this
var inputValue = document.querySelector('#linkName").value;

and for this second one you need to also apply the property value at the end, and you need to remove the space between input and #linkName.

var inputValue = document.querySelector("input #linkName");

//Like this
var inputValue = document.querySelector('input#linkName").value;

As in for your other questions, I'll leave that for other people in the community to answer.

Louise St. Germain
Louise St. Germain
19,424 Points
Louise St. Germain
Louise St. Germain
19,424 Points

Hi Antony, I just changed your answer from a comment to an actual answer, so it will be more visible to people and can be upvoted. Thanks for stepping in to help! :-)

Rodrigo Novaes
Rodrigo Novaes
9,629 Points
Rodrigo Novaes
Rodrigo Novaes
9,629 Points

I was stuck on this one as well, I had to find the answer somewhere else, because this part was not covered very well in my opinion.

Here is my solution for the second part of the Challenge:

document.getElementById('link').textContent = inputValue;