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

Posted by Carlos Marin
Carlos Marin
2,675 Points

Why does this code not work, but when switched around, it does?!!?!?

the code inside the box does not work, but when I switch it as so: let inputValue = document.querySelector('input').value; document.querySelector('a').textContent = inputValue;

it does work. WHY is that??? HELP!!!!!

app.js 
let inputValue = document.getElementsByTagName('input')[0].value;
inputValue = document.querySelector('a').textContent;
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>
Carlos Marin
Carlos Marin
2,675 Points

well the first code I entered seemed correct to me but it was not. I had to goggle the correct answer, and so I was confused as why code did not work, and was trying to figure out what the interpreter was computing.

1 Answer

ale8k
ale8k
8,299 Points
ale8k
ale8k
8,299 Points

Hi,

Let's take a look at what you're trying to do side by side:

let inputValue = document.getElementsByTagName('input')[0].value;
inputValue = document.querySelector('a').textContent;

let inputValue = document.querySelector('input').value; 
document.querySelector('a').textContent = inputValue;

/*
 Answer would be this:
*/
let inputValue = document.getElementsByTagName('input')[0].value;
document.querySelector('a').textContent = inputValue; // swapped them here

As we can see, the second example (which you want to happen) you're storing input value into the textContent of 'a'. But above that, you're attempting to reassign input value with the text content of 'a'. I hope this helps!

Carlos Marin
Carlos Marin
2,675 Points

Oh I see! totally makes sense now! thank you! :D I was confused.

ale8k
ale8k
8,299 Points
ale8k
ale8k
8,299 Points

No problem :P get used to making mistakes like that, happens all the time haha!