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 trialSherrie Jeffers
Front End Web Development Techdegree Student 7,909 Pointstext displaying as "text" after making createElement function
heres my snapshot, I have now followed the video exactly twice and right after making the createElement function my form no longer works and I get "text" in my element instead of the name from the input field. no idea why
2 Answers
Jeff Muday
Treehouse Moderator 28,720 PointsYou are so close (I think you knew that already). Good luck with your JavaScript journey-- it's a worthwhile endeavor!
Right now you are dropping in the word 'text', rather, it should be the parameter that you pass in. All you have to do is unquote the text parameter. Like this...
function createLI(text) {
function createElement(elementName, property, value) {
const element = document.createElement(elementName);
element[property] = value;
return element;
}
const li = document.createElement('li');
// const span = createElement('span', 'textContent', 'text');
const span = createElement('span', 'textContent', text);
li.appendChild(span);
const label = document.createElement('label');
label.textContent = 'Confirmed';
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
label.appendChild(checkbox);
li.appendChild(label);
const editButton = document.createElement('button');
editButton.textContent = 'edit';
li.appendChild(editButton);
const removeButton = document.createElement('button');
removeButton.textContent = 'remove';
li.appendChild(removeButton);
return li;
}
Jeff Muday
Treehouse Moderator 28,720 PointsWhen a piece of text is in quotations -- "myvar" it is treated by JavaScript as a literal string.
console.log("myvar");
or
console.log('myvar');
always prints the word myvar.
When a piece of text is not in quotations it is a variable or parameter.
console.log(myvar);
it will print the value of what the programmer has put inside myvar
. For example.
var myvar = "Hello";
console.log(myvar);
will print Hello
You can also see this hint by the syntax coloring (if you aren't colorblind). You notice that a literal string is colored ORANGE and a variable is colored PINK-- this will change depending on your editor but here it is apparent.
In your case, the parameter text
was being treated as a literal when it was in quotations 'text' and was being sent to the element. What you wanted was the value of the parameter or variable called text
I hope this makes sense-- but you will catch on and it will become second nature to you!
Sherrie Jeffers
Front End Web Development Techdegree Student 7,909 PointsSherrie Jeffers
Front End Web Development Techdegree Student 7,909 PointsCan you explain to me why text shouldn't be in quotes? I'm not sure I understand why any of them need to be in quotes.