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) Traversing the DOM Getting All Children of a Node with children

Javier Gandia
seal-mask
.a{fill-rule:evenodd;}techdegree
Javier Gandia
Full Stack JavaScript Techdegree Student 9,153 Points
Posted by Javier Gandia
.a{fill-rule:evenodd;}techdegree
Javier Gandia
Full Stack JavaScript Techdegree Student 9,153 Points

just an FYI to whoever is taking these lessons https://teamtreehouse.com/library/getting-all-children-of-a-node-with-chi

he is using const to set the value.. with const u can not change the values of that element later.. for example, const myButton = document.getElementById("myButton");

myButton.addEventListener("click", () => { myHeading.style.color = myTextInput.value; myTextInput.value = ""; });

this will not work on safari browsers..

neither will const lis = listUl.children;

for (let i = 0; i < lis.length; i++){ attachListButtons(lis[i]); }

not sure why he is using const to set the values of all those variables.. but it doesnt work on safari.. this isnt a question.. its just information, i guess

1 Answer

Montazar Al-Jaber
Montazar Al-Jaber
19,611 Points
Montazar Al-Jaber
Montazar Al-Jaber
19,611 Points

With const you cannot change the reference of the variable, but you can change the reference's properties. This means, you cannot overwrite a variable nor reassign it, but you can do anything else to whatever the variable references.

For example,

const myButton = document.getElementById("myButton");
myButton.addEventListener("click", () => {
    myButton.style.backgroundColor = "red";
});

Successfully changes the background color of the button to red when it is clicked. Remember, myButton is an object and JavaScript allows you to change the object's properties the constant variable refers to, but not the assignment.

I highly recommend you "Defining Variables with Let and Const" with Andrew Chalkley. Also, you should probably use Chrome since it is used by all the Treehouse teachers, and most developers.

Javier Gandia
seal-mask
.a{fill-rule:evenodd;}techdegree
Javier Gandia
Full Stack JavaScript Techdegree Student 9,153 Points
Javier Gandia
.a{fill-rule:evenodd;}techdegree
Javier Gandia
Full Stack JavaScript Techdegree Student 9,153 Points

i do use chrome.. but i sent it to a friend of mine who uses safari, and he explained that nothing was happening on the safari browser.. it does work on the chrome though

Montazar Al-Jaber
Montazar Al-Jaber
19,611 Points

javier gandia, I ran it on my Safari browser, and the issue is not with the constant variable. Safari was complaining about the toggleList variable identifier shadowing a global variable with that same name.

I've replaced every instance of the toggleList variable with tList.

const tList = document.getElementById("toggleList");

Now it works properly. Once again, this has nothing to do with the constant variable.