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

Brian Miller
PLUS
Brian Miller
Courses Plus Student 6,696 Points

Select the <input> element with the ID linkName and store its value in the variable inputValue.

Not sure what is going on, I have selected the ID of the input element: document.getElementById("linkName");and placed its value: linkName, in the variable const inputValue = document.getElementById("linkName"); I have run the code outside of workspaces, and get no errors. I have previewed the code in workspace and everything looks good. My understanding is to use the document.getElementByID method to store the value of the input element (linkName) in a variable named inputValue. What am I missing?

html> <head> <title>DOM Manipulation</title> </head> <body> <div id="content"> <label>Link Name:</label> <input type="text" id="linkName"> <a id="link" href="https://teamtreehouse.com"></a> </div> <script> const inputValue = document.getElementById("linkName"); </script> </body> </html>

app.js
const inputValue = document.getElementById("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>
Brian Miller
Brian Miller
Courses Plus Student 6,696 Points

I should also add that I was able to successfully complete this code after a google search using :

let inputValue = document.querySelector('#linkName').value;

Why would the getElementByID not work? Thats what the code challenge task called for, right?

let inputValue = document.getElementByID('#linkName').value;

Have a blessed day.

8 Answers

This works:

var inputValue = document.getElementById('linkName').value

The difference between that and the following you posted:

let inputValue = document.getElementByID('#linkName').value;

The d in Id is lowercase

No #

why
document.getElementById('linkName').value and not document.getElementById('linkName');

Philip,

why "document.getElementById('linkName').value and not document.getElementById('linkName');"

because the challenge asks to store its value which is just one of its attributes. Does that make sense?

Regards,

H

Thank you, have a blessed day.

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

Have a blessed day.

Both

var inputValue = document.getElementById('linkName').value;

var inputValue = document.querySelector('#linkName').value

are correct answers

What is the purpose of that .value at the end ?

Have a blessed day.

God bless you Blessed Marufu.

Nnanna Okoli
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Nnanna Okoli
Front End Web Development Techdegree Graduate 19,181 Points

Challenge Task 1 of 2 Select the <input> element and assign its value to the variable inputValue.

var inputValue = document.querySelector('#linkText').value

This one worked as well: var inputValue = document.querySelector('linkName').value

This one is working and from my opinion is the correct answer!

var inputValue = document.querySelector('#linkName').value

This actually worked. Thanks