JavaScript30 - Day 1

By Camilla Krag Jensen naxoc |

Day 1. I can do this. First of all I would like to thank Wes Bos for the awesome learning material. I haven't really played around with all the cooler visual stuff JS can do and the daily assignments look really visually pleasing. It is going to feel good making them work. Go check out JavaScript30 if you wanna learn JavaScript.

I'm not going to describe what the assignments for the JavaScript30 lessons are, but just pull out the interesting stuff I learned or got refreshed. I am writing this for my own reference too.

Selectors

I had heard about the vanilla JS selectors, but I only used them a couple of times. jQuery has always been my goto.

document.querySelector('.class-name li .last');

Will return an Element if one is found or null if there was no such thing.

And for more than one element:

document.querySelectorAll('.class-name');

Will return a NodeList that can be iterated over using for instance for or NodeList.forEach().

Audio

I had no idea that the <audio> tag was so easy to interact with. Just call .play() on it and it plays! I like it.

Event listeners

CSS transitions are a thing I never even thought about listening for events for, but it exists! I went and found the list of all events and that is really long.