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

Chisel Delahanty
Chisel Delahanty
3,609 Points

DOM modifying elements – quiz difficulties

I'm doing the quiz directly following the lesson in which we learn about "textContent" and "innerHTML". However, the quiz is behaving strangely, and I'm not sure whether it's due to my misunderstanding the challenge questions or to a technical bug.

I passed Challenge Task 1 with the following two lines of code (although it was prompting me for only one, I couldn't see how to solve the challenge without both lines of code): const input = document.querySelector("input"); let inputValue = input.value;

That answer was accepted and I moved onto Challenge Task 2, but when I added a third line of code – without touching either of the previous ones – I got the message "Oops, it looks like Task 1 is no longer passing". Third line added: a.textContent = inputValue;

Since I don't see how this third line could have affected the first two, I am wondering if this may be a technical issue. Any advice would be greatly appreciated!

app.js
const input = document.querySelector("input");
let inputValue = input.value;

a.textContent = inputValue;
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>

1 Answer

Steven Parker
Steven Parker
231,271 Points

A syntax error invalidates the entire script.

And since the tasks are retested in order, it's complaining about the earlier task.

The error is because you have not declared a variable "a" but you're trying to set a property on it. So first you'll need to do something similar to what you did on the top line, to create "a" and set it to be the element identified by the "a" tag of the document.

Chisel Delahanty
Chisel Delahanty
3,609 Points

Thank you, Steven! Not only did your answer help me pass this challenge, it also helped me better understand the way the Treehouse challenges work, which will be useful in the future.