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 trialGustavo Marrochi
9,258 PointsSet the text content of the a tag to be the value stored in the variable inputValue.
I not understand
let inputValue = document.querySelector('#linkName').value;
let link = document.querySelector('#link');
let content = document.querySelector('#content');
link.addEventListener('click', () => {
inputValue = link.innerHTML;
});
<!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>
Erik L
Full Stack JavaScript Techdegree Graduate 19,470 PointsI'm glad to see that Im not the only one having problems understanding the videos and quizzes for this section, I feel some things could have been explained better
Mark Del Mar
Courses Plus Student 5,167 PointsAs many have stated in this thread, I've had little to no problems until this section of the course. I don't know what it is about Dave, but he teaches so much better. No offense to Guil. There's been several times I'll write something down only to have him say "this isn't really used anymore" or "don't worry about understanding this".
42 Answers
Rachel Flores
2,424 PointsThis entire course is very confusing. The JavaScript courses were excellent, but the challenges and videos in this one are not clear.
Keith Carrillo
6,909 PointsI know there are other teachers on the subject on TTH and some vids on youtube can help when its gets a little confusing. Try going to the tracks under Javascript & Jquery for another teacher though.
Martina Her
2,168 PointsI thought I was the only one. I miss the way Dave taught. The challenges in this series confuses me like..."did they even taught us that?" Oh well. Thank goodness for the community!
MAisam Bakhshi
7,210 PointsDave was a much better teacher.
Joseph Groark
24,499 PointsI fully agree, no clear objectives are set. I really think these great ways to work with the DOM are ruined by a lack of clarity.
Michael Johnson
6,340 Pointsholy shit i thought i was the only one.
Dillon Reyna
9,531 PointsMan I'm really glad to hear that it's not just me!
Charlie Harcourt
8,046 PointsIt's bad that this comment was posted on July 15th and thy have done NOTHING to try and change it!!!!
Rodney Buljubasic
Courses Plus Student 13,899 PointsI believe this and it is a problem, it is very demotivating for me now and I hardly can master another failed day. So I push thought this hoping there is light at the end of the tunnel, I dont see it though!!!
Nicholas Wallen
12,278 PointsAgreed completely. It's not that this stuff is hard persay, but theres something different about how they are presenting the information versus all of the other courses I have taken
Britney Aronson
11,584 PointsThis whole course is for shit. I haven't had any issues comprehending what is being taught at treehouse until now. Please redo this whole damn course.
Nnanna Okoli
Front End Web Development Techdegree Graduate 19,181 Pointsnot clear at all, and it's quite upsetting.. everything else was fine until I started JavaScript :(
Michael Davis
Courses Plus Student 12,508 PointsGood Morning!
You're over thinking it! The challenge, 2nd step, just wants you to set the text of your link to the value in your inputValue. You already stored your inputValue (#linkName.value
), this challenge is just wanting you to assign that string to the anchor's text value.
let inputValue = document.querySelector('#linkName').value;
let anchor = document.querySelector("#link");
anchor.innerText = inputValue;
Keith Carrillo
6,909 PointsQuick question why does the question ask to set the a tag to be the value stored in the inputValue.. I think it might need to be reworded.
Michael Davis
Courses Plus Student 12,508 PointsThe textBox that we gave the ID of linkName
contains the name for the link. We gave the a
tag an ID of link
, and by setting it's innerText
to the value stored in the inputValue
variable (which is getting the text we entered into the textbox) we can dynamically update the link text.
Linda Gomes
3,584 PointsI am struggling with this challenge and I don't understand where is the let anchor coming from?
arik
5,791 PointsWhat I don't understand is why I have to reverse the order of storing the text content of a tag into inputValue to pass the challenge.
What is the difference between these two codes? I thought that the first is storing, while the second one is assigning. Why did I fail on the challenge using the first code ?Any explanation is highly appreciated, many thanks in advance.
inputValue = a.textContent;
a.textContent = inputValue;
Michael Davis
Courses Plus Student 12,508 Pointsarik, the equals =
is stating that the item on the left is assigned the value on the right. Thus in the sample you provided:
inputValue = a.textContent;
a.textContent = inputValue;
The first statement is stating that the variable "inputValue" is being assigned the value stored in a.textContent
. Whereas in the second statement, it is stating that a.textContent
is being assigned the value of stored in inputValue
.
For example:
let myVar = "Cat";
// myVar now contains the string value `Cat`
let myVar2 = "Dog";
// myVar2 now contains the string value `Dog`
myVar = myVar2
// myVar now contains the string value `Dog`
The single equals is an assignment operand, the item on the left is set to the value of the item on the right. If this doesn't clarify the issue, please feel free to clarify the question and ask again :-D
Lewis Crichton
292 Pointslet inputValue = linkName.value; link.textContent = inputValue; // assigns value of link to the text of anchor
babasariffodeen
6,475 PointsI just think the question could have been worded a little better, but that's just my opinion!
Because I also got stuck initially like many others, until I saw your post. Then I understood what it was asking for!
Tyler Durden
2,406 PointsIt needs to be reworded, the wording is so vague and bad, and I' m not even a beginner, I'm a junior/senior in a Computer Engineering major but brushing up on my JS and I couldn't even figure it out, not due to the complexity of the problem but the wording/instructions being so poor.
Randell Purington
9,992 PointsThank you!!!
Nathaniel Skinner
3,552 PointsI've never seen anchor or innerText up to this point. How can that be the answer if it has not been taught yet.
Michael Williams
Courses Plus Student 8,059 PointsHey Nathaniel Skinner, .innerText
was covered in the first video in this section. You can find it here: https://teamtreehouse.com/library/getting-and-setting-text-with-textcontent-and-innerhtml
Regarding the anchor
variable comment, I thought the same thing as you, but remember, it's a variable. So you could name it anything you wanted. Michael Davis just went with anchor since the the a
tag in html refers to anchor.
I know this section is confusing, but stick with it, and it'll get easier. I also found this thread pretty helpful: https://teamtreehouse.com/community/for-those-confused-about-this-course-read-this-for-a-full-explanation
Hope this helps.
Ula Troc
1,881 PointsI am not sure if this is correct, maybe I missed it somewhere, but .innerText was not covered?
Sylvia Castro
9,944 PointsThis for sure was no where in the video for me to even know what to do. I think I've been pretty good at learning and getting all of the quizzes until now. Unfortunately we are mid way into 2019 and nothing has changed. For the amount of money we pay, this should be better structured or at least updated.
Keith Carrillo
6,909 PointsThis question has to be reworded. I read it as set the a tags content inside of the variable inputValue. I kept getting it wrong until I realized this.
Michael Johnson
6,340 Pointspreach
Tom Stanley
15,308 PointsAgreed
Matthew Gilliland
5,105 PointsI agree that this is badly worded. The quizzes in this whole course have been much more vaguely-worded than those in other courses I've taken.
Clifford Gagliardo
Courses Plus Student 15,069 PointsIs there a way to flag this question? This was a poorly worded question and it clearly has confused a lot of people.
David Soto
7,581 PointsWTF is up with this question. I got more confused entering the 2nd part of the challenge. Usually, Treehouse does a good job of explaining things better. Not so much with this course.
Brandon Vaught
12,343 PointsAlso,
let inputValue = document.getElementById("linkName").value;
let anchor = document.getElementById("link");
anchor.textContent = inputValue;
will work.
Saqib Ishfaq
13,912 Pointsbrilliant! simple and easy .thanks
Brian van Vlymen
12,637 Pointsok, what is the difference between two of those methods are querySelector and getElementById? We only wanted first one element or specified the id. Is do not matter to chose those methods?
Robert Hemfelt
7,303 PointsGlad I was not the only one extremely confused by the wording of this question, thanks for the help!
Ivan Peric
8,375 PointsWell this was confusing
Juan Mercedes
6,478 PointsI agree, since some of the questions are vague, is natural we tend to overthink the solution.
Diana Ci
18,672 Pointslet inputValue = document.getElementById ('linkName');
inputValue = linkName.value;
let anchor = document.querySelector('a');
anchor.textContent = inputValue;
or
let inputValue = document.getElementById ('linkName').value;
let anchor = document.querySelector('a');
anchor.textContent = inputValue;
or
let inputValue = document.getElementById ('linkName').value;
let anchor = document.getElementsByTagName('a')[0];
anchor.textContent = inputValue;
Anne Donald
9,847 PointsThank you for your help on this one, I was getting a little confused too with the wording!
arik
5,791 PointsWow, thank you very much Michael Davis:) Now I get the point, I think what made me confused is the direction of the challenge that asks to "store"the content of a tag into the variable inputValue (but to "store" something we need to still use var, let, or const keyword isn't it? or not? :-D). It made me think that I need to store "a" into var inputValue. Anyway need to learn more, and once again thank you very much, everyone in this forum is really nice and helpful.
Lewis Crichton
292 Pointslet inputValue = linkName.value;
link.textContent = inputValue;
Michael Johnson
6,340 PointsThis whole thing hurts my brain. In a bad way. Please rephrase/rework these questions.
Ernie Van Duyne
5,335 PointsI agree with everyone here. This course needs to be done over. The challenges do not match up well with how it is being taught here.
I have never had this with any the other TeamTreeHouse courses.
It also looks like nobody from Team Treehouse is monitoring this or they would do something!
nicolo orcine
3,138 Pointssame problem. this course challenges is so confusing
Arpana Roy
2,028 PointsPrevious videos and their challenges were co-related , but this part is not at all related. I mean the videos teach something else but the questions are different , and I have to post it in the community every time. Not sure how to go forward.
baderbouta
7,804 PointsHere I was, almost pulling out my eyes because I thought I was going insane, felt like dumb-rock, till I found out literally hundreds of other people were experiencing the same problem. Yes, this track really does suck, sorry for my language but I'm beyond angry that they haven't tackled these issue's yet.
Tyler Dix
14,230 PointsDecember, 2018 update: This is still an issue. They may have included a link TO A PREVIOUS SECTION which I watched for clarification, and it didn't help clarify. Treehouse, please listen to your community and make some meaningful adjustments! Honestly trying to solve this, and then reaching to outside resources, and then eventually copying/pasting the solution isn't an ideal way for a student to learn.
Michael Williams
Courses Plus Student 8,059 PointsI've been where you are. I don't know if it's because the DOM topic is a bit more challenging, the explanations aren't as good, or a bit of both, but this course is definitely harder than the others. I'd message support, which is what I did. I pointed them to this thread to gauge how maddening this course can be for people.
Michael Taylor
Courses Plus Student 1,798 PointsMy response may be a little dated, but it seems some of you are getting a little discouraged. If this stuff was easy everyone would be doing it!. Speaking from my personal perspective I've reached this point in this course in about a week your mileage may vary. The point is if I put you in a Spanish classroom for 8 hrs a day for one week and then threw you into a room full of native fluent Spanish speaking people.....Do you think you could carry on a conversation with them? Most likely NOT! So, the point to the story is, hold your head hi and don't let this stuff get you down! You can do it if you dedicate yourself to it! It's a grind and your going to have good days and bad days but don't give up!! Do what you can and then get on google and research ask the question just like you have been doing and when all else fails, look up the answer. Study the code line by line and when you come to something you don't understand Stop! research it and ask questions before you move on! I promise you once you get your first language down moving forward with this craft becomes easier! My first programming language was python. HOLLY COW was if difficult to even get started.....Questions like this would stop me dead in my tracks and I wouldn't even know where to begin. ...But what python taught me, that can be applied to other languages. is how to approach problems and break them down to their simplest forms. So, far Javascript and any kind of development is the same way! Every program no matter what it is! Starts with simply declaring a variable.....then a loop.....maybe a function..then one function turns into 10 then 50. The point is to start small and build up.....Brick walls aren't only build from the ground up...they are built one brick at a time!
Michael Williams
Courses Plus Student 8,059 PointsI think this is helpful and encouraging. I think one thing I struggled with was the transition from js
to the DOM concepts. While it takes time and practice to understand them, I do still believe there could be improvements to this course to make the transition easier. One thing that helped me was learning about this topic from other teachers and materials. For example, I've found this Web Dev Bootcamp course from Colt Steele massively helpful. It's only $10 (udemy has a ton of sales all the time) and a great supplement to everyone's learning.
Michael Johnson
6,340 Pointslet inputValue = document.querySelector('input').value;
link.textContent = inputValue;
Daniel Eckert
Courses Plus Student 1,756 PointsI am with pretty much everybody here. This guy sucks in comparison. Free youtube videos literally taught me more in an hour then 10 hours of banging my head against the keyboard trying to figure out what this guys trying to tell me.
David Ferenc
6,993 PointsWhy I am thinking that teachers do not read this comments at all? Maybe its time to try different course...
Rick Clark
Courses Plus Student 10,838 PointsThat's what I did. Took the full CSS Basics, CSS Selectors and Html courses and I'm having an easier time the 2nd time through the DOM courses.
nathanielcusano
9,808 Pointslet inputValue = document.getElementById("linkName").value;
let anchor = document.getElementById("link");
anchor.innerHTML = inputValue;
It doesn't matter whether you write it as anchor.innerText = inputValue ; either
Rodney Buljubasic
Courses Plus Student 13,899 Pointslet anchor = document.getElementById("link");
anchor.innerHTML = inputValue;
this is correct, but I had help from you, I hope this will make sence later on
Lewis Crichton
292 Pointslet inputValue = linkName.value; link.textContent = inputValue; // assigns value of link to the text of anchor
Tshering Tamang
3,492 PointsOne point on losing to learn JS from here and guess what i saw all confused, I think the question need to be reworded and made clear.
Tuan Phan
10,825 Pointslet input = document.querySelector(`#linkName`);
let inputValue = input.value;
let anchor = document.querySelector(`#link`);
anchor.textContent = inputValue;
This worked for me.
Niklas Jansson
5,915 PointsThis whole DOM track has been confusing to me. Glad I were not the only one. Half of it feels pointless and literally does the same thing. And I haven't really grasped all of it either. I just prefer using jQuery, even though I JUST watched these videos, I barely undertand it.
Jarett sisk
7,522 Pointsthe DOM track has been confusing to me aswell. I think part of it is do to the change of teachers. but this question on specific had me at a stand still. my first thought was to just re write the code so that im setting any potential text from the a tag equal to original inputValue variable. I see now that this is definitly not the case
David Ryan
Courses Plus Student 14,981 PointsTreehouse, please use similar approaches to lessons with Dave. I flew through those but once i got here it became confusing. Teach a lesson and then slightly veer off into a coding quiz that isn't the same stuff but the same information...
Jerome Heaven
8,641 PointsSeriously glad to be a part of this community. The wording of this question is confusing. Thanks for your help everyone in here.
Charlie Harcourt
8,046 PointsIt's a real shame they haven't updated this question / lessons yet!
Antonio De Rose
20,885 PointsI agree that the first question does not have any issue with the reading, however, the second does, gives a little bit of mis-interpretation, however, when I get the error, I did read as many times, till I got to understand, that what the question is about.
One thing, the requirement giver, will not always, the same from person to person.
you have an 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>
<!--and if you break the questions-->
<!--q1) Store the value of the text input element in the variable inputValue.-->
<!--I do not think anyone would have an issue-->
let inputValue = document.getElementById("linkName").value;
<!--question 2-->
<!--Set the text content of the a tag to be the value stored in the variable inputValue.-->
<!--break the question, set the text content of the a tag, there is only one a tag, that too could be retreived
by using the ID and the property we have to target from JavaScript would be innerHTML,
and now, break the question again, with an additional step, set the text content of the a tag, to be the
value to be stored, in the variable inputValue-->
document.getElementById("link").innerHTML = inputValue
ivana kantnerova
15,932 Pointslet inputValue = linkName.value; link.textContent = inputValue;
Ishaq Jones
7,184 PointsWell that was weird.
Jarett sisk
7,522 Pointsthis worked for me. :
let inputValue = document.querySelector("input").value;
document.querySelector("#link").textContent = inputValue;
Rick Clark
Courses Plus Student 10,838 PointsI agree with you Erik!
Andrew Denmead
6,577 PointsYeah I want to add my name to the list of people who found this section on the DOM confusing. There's stuff in the exercises that isn't really demonstrated in the videos and some of the questions are really confusingly worded.
Ben Kaufman
6,813 PointsYou need to declare the link as a variable before you mess with it,
So declare a variable called 'link' and connect it with the <a> element
then access the textContent property of this variable and make it equal to the input
TARIQ ALREHILY
14,822 PointsAlso,
let inputValue = linkName.value; let link = document.getElementById('link'); link.innerHTML = inputValue;
will work :)
Gareth Alexander
Full Stack JavaScript Techdegree Student 2,943 PointsI found this hard to follow as well. I think it this course is better for people who have done some Javascript and DoM and are just looking to refine some fundamentals. As someone who has never coded before I found this really hard to follow along.
Michael Davis
Courses Plus Student 12,508 PointsMichael Davis
Courses Plus Student 12,508 Points<Removed>