JavaScript JavaScript and the DOM Traversing the DOM Getting the First and Last Child

Andy Goodman
Andy Goodman
12,726 Points

My code for the additional challenge Guil gave...

See link below for the code I wrote to add/remove the 'up' and 'down' buttons when new items are added/removed or moved.

If anyone is stuck on this, hopefully it can help you. I also removed a lot of repeated code and 'hoisted' the variables to the top of each section.

https://w.trhou.se/c1spg674za

Ian Salmon
Ian Salmon
Pro Student 10,652 Points

This is very well done and gave me some great ideas.

I especially liked..

  • How you created a function using querySelector to define your variables. It really cleaned up the top lines (although I wouldn't personally use $, it's too confusing in my jquery mind).
  • Your solution to hiding the 'up' and 'down' buttons for firstElementChild and lastElementChild was very easy to understand (other students: go to line 77 for the loop).

Thanks for sharing this with the community!

Michel Ribbens
Michel Ribbens
18,417 Points

really good solutions and very clean code! thanks for sharing, this gives me some new ideas on how to structure my code better in the future

1 Answer

Birthe Vandermeeren
Birthe Vandermeeren
17,139 Points

Nice! I had the same idea of hiding the buttons by setting their visibility to "hidden". My function is different though: first it loops through all buttons in the list to set their visibility to "visible". Then, it sets the visibility of the up button of the first item in the list and the visibility of the down button of the last item in the list to "hidden". So, no ifs and else ifs. I've posted it on the forum too, if you're interested.