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 DOM Scripting By Example Adding and Removing Names Registering Names

Doron Geyer
seal-mask
.a{fill-rule:evenodd;}techdegree
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points
Posted by Doron Geyer
.a{fill-rule:evenodd;}techdegree
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points

small queries with the first video

  1. instead of input.value= " ";  // input is a variable holding form.querySelector("input");

    could I use 

    input.textContent= " " ;

  2. when declaring the UL variable in the video he declares it as a const within the form submit events function. is there a reason why this is called there rather than at the top of the scripts file. If it is a constant and points directly to an input element, would you not want it globally available for expansion purposes?

thanks in advance.

2 Answers

anthony amaro
anthony amaro
8,686 Points

a short answer to your first question is no. value is when you actually need to get the value from an input.

for example

const city = document.querySelector('input');

button.addEventListener('submit', e => {
e.preventDefault();
   // now lets say you are searching for a city.
  // after you click the button you are going to see in the console whatever you typed in the input field.
console.log(city.value)
})

the textContent allows you to change whatever is in an html element lets see

<p class="my-text">Hello from html</p>

now to be able to have access in JavaScript

const element = document.querySelector('.my-text');

// now if we use textContent to change p content

element.textContent = 'hello from JavaScript';

now the <p> from html have changed

<p class="my-text">Hello from JavaScript</p>

as for declaring the variables with const

use const when you know the value wont change or you don't want it to change. as for the teacher using the variables inside the function probably because he is only going to need them inside the function and wont use them anywhere else. but if you want to declare your variables at the top its fine, its just preference in this case. hope this helps.

Doron Geyer
seal-mask
.a{fill-rule:evenodd;}techdegree
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points
Doron Geyer
.a{fill-rule:evenodd;}techdegree
Doron Geyer
Full Stack JavaScript Techdegree Student 13,897 Points

OK great I get what you saying. I was thinking because the input field's contents were essentially text and after using the input I needed to change the input fields text back to an empty string. Using textContent is what came to mind as I was changing the "text" inside the input.

cheers, Doron

anthony amaro
anthony amaro
8,686 Points
anthony amaro
anthony amaro
8,686 Points

the only reason you have to set the input.value = '' to empty strings is because after you submit the form or click a button you want your inputs fields to be empty again. if you don't set it to empty strings you will have to delete whats in the input field yourself.