JavaScript JS

Overview

JS syntax JS comments

Applying JS

<script>
(internal JS) <script src=""> (external JS)

Testing JS

Browser console console.log() alert()

Defining variables

Overview const let var let vs. var

Data types

Overview Strings Numbers Booleans Arrays Objects

Operators

Overview Arithmetic Comparison and logical Assignment

Conditionals

if () {} else {} switch Conditional (?) operator

Rounding numbers

Math.round() Math.floor() Math.ceil()

Randomization

Math.random() Random number between two values Random integer (rounded number) between two values Random value from an array

Creating functions

Overview Defining functions Arrow functions Parameters/​arguments Function scope

Using functions

Running functions return Side effects

Basic loops

while for for...in for...of break, continue

Repeating and delaying code

setInterval() clearInterval() setTimeout() clearTimeout()

Overview

Introduction Element objects

All about objects

Objects Properties Methods Property accessors Constructing objects this

Targeting elements

document​.querySelector() document​.querySelector​All() document​.getElement​ById() document​.getElements​ByClassName() document​.getElements​ByTagName() .closest()

Changing content

.innerHTML .textContent .innerText .outerHTML

Changing CSS

.classList .style["property-name"] = ""

Changing attributes

.setAttribute() .getAttribute() .hasAttribute() .removeAttribute()

Creating and moving elements

document​.createElement() .append() .prepend() .remove()

Event handlers

Overview .addEvent​Listener() .removeEvent​Listener() Inline event handlers

Event Objects

Overview .preventDefault()

Special cases

Draggable elements Custom cursor Parallax scrolling Parallax hover

Observers

Intersection Observer Resize Observer Mutation Observer